1. v-text 将vue对象data中的属性绑定给对应的标签作为内容显示出来 (text:'<a src="">123</a>')
2.v-html 作为html语法输出,类似js中的innerHtml属性。(text:'<a src="">123</a>',可进行点击)
注:如果以html进行输出,将会导致XSS攻击,所以在服务端对用户提交的内容进行处理,一般将尖括号进行转义 ’<>‘
3.v-show (true 显示) 根据表达式的真假来切换所绑定的dom的display属性
4. v-if (true 显示) 视图内容的显示与隐藏 (元素被插入或移除) 不建议使用 v-else-if v-else
5. v-for <li v-for='item in list'>{{item}}</li> 注: v-for 与 v-if 不建议同时使用
6.v-on :click='btn' (@click='btn') 给dom添加一个事件监听 参数:event
7.v-bind:name (:name='pre') 参数 : attr/Prop (optional) 注:标签属性 id name src
8.v-model 建立双向数据绑定;
v-model修饰符:
v-model.lazy:一般v-model绑定的数据都是实时同步的,加上这个修饰符可以等到change事件再同步另一个的值;
v-model.number:自动将输入的值转为数值类型
v-model.trim:自动trim
9. v-pre 想显示{{}}标签,而不进行替换 <span v-pre>{{这里的内容时不会被编译的}}</span>
缩写:#
参数:插槽名(默认default)
插槽:Vue 插槽详细解析
定义一个blogPost组件,在组件模板中添加了三个slot(卡槽),header,footer,default,在blogPost组件应用时,为他添加三个div的子dom,并通过v-slot为他们设置插槽名
还有几个不是很常用: