本节课学习的指令比较多,但是都很简单,
直接看代码
之前绑定数据都是这么玩的,还有一种新的玩法,是通过指令
上面代码时用了v-text 和v-html两个指令。
嗯 v-text 指令 那个p 标签里面 会显示<h1>hrllo</h1>vue
v-html 指令那个p标签会显示 hello vue
text 指令就是 不解析 data数据中心属性值里面的html 标签
html 会解析
上面代码 我们用了一个 v-show 。
v-show绑定的数据是ok ,ok 在数据中心里面是true 然后就会显示p标签,如果OK 在data数据中心是false 那么就会隐藏p。
v-show和v-if是差不多一样的。
上面代码 有运营到了我们之前说的操作层methods 绑定了一个点击事件sss 点击一下 数据中心的OK 变成false 或者变成true 相当于一个开关。
在回顾一下 点击事件 还可以用@代替v-on 哦
这段代码 吧v-show 改成了 v-if 效果是一样的
v-show 和 v-if 的区别
v-show 是没有预加载,通过控制css来显示的
v-if 是有预加载,通过条件判断 显示隐藏