这里写目录标题
插值
功能:用于解析标签体内容
写法:{{message}},xxx 是 js 表达式,可以直接读取到 data 中的所有区域
阻止vue生成生产提示
Vue.config.productionTip = false;
v-xxx指令
-
v-bind // 单向数据绑定:只能由data中的数据流向页面
-
-
v-model // 双向数据绑定:可以由data中的数据流向页面,也可以由页面(用户输入)流向data
-
v-on // 绑定事件,注:绑定的事件前不需要再加on
-
v-for // 循环:遍历数组,对象,字符串
-
v-if,v-else,v-else-if // 判断
v-if 做判断,隐藏(是否存在)
区别:对于元素只是一次可以选择使用v-if(消耗内存),操作次数多v-show(并没有销毁元素)
在vue2中,v-for优先级比v-if高
在vue3中,v-if优先级比v-for高
2. v-if和v-for不能同时使用
3、同时使用需要在外层嵌套盒子,在外层进行v-if判断,在内层进行v-for循环
-
v-cloak // 解决初始化慢 而导致页面闪动的情况
-
v-once // 设置了以后,更改值不会发生改变,优化性能
-
v-pre // 设置了以后,会让插值和指令失效
-
v-text和v-html // 插值
1.v-text和v-html
相同点:都会覆盖文本
不同点:v-text只读取文本,v-html读取标签
2.插值添加值:注:不要在用提交时使用v-html,不要在动态渲染时时使用v-html