文章目录
- P.13.1 &＃61;&＃61;v-once&＃61;&＃61; 只渲染元素和组件一次
- P.13.2 &＃61;&＃61;v-html&＃61;&＃61; 解析显示带有html标签的文本
- P.13.3 &＃61;&＃61;v-text&＃61;&＃61; 更新元素的 textContent
- P.13.4 &＃61;&＃61;v-pre&＃61;&＃61; 原样显示文本
- P.13.5 &＃61;&＃61;v-cloak&＃61;&＃61; 保持在元素上直到关联实例结束编译
- P.14 &＃61;&＃61;v-bind&＃61;&＃61; 动态绑定 基本使用
- P.15 &＃61;&＃61;v-bind&＃61;&＃61; 动态绑定class(对象语法)
- P.16 &＃61;&＃61;v-bind&＃61;&＃61; 动态绑定class(数组语法)
- P.17 &＃61;&＃61;作业&＃61;&＃61; v-bind和v-for结合使用
- P.18 &＃61;&＃61;v-bind&＃61;&＃61; 动态绑定style(对象语法)
- P.19 &＃61;&＃61;v-bind&＃61;&＃61; 动态绑定style(数组语法)
- P.20 &＃61;&＃61;computed&＃61;&＃61; 计算属性的基本使用
- P.21 &＃61;&＃61;computed&＃61;&＃61; 计算属性的复杂使用
P.13.1 v-once 只渲染元素和组件一次
<body><div id&＃61;"app"><h2>{{message}}h2><h2 v-once>{{message}}h2>div><script src&＃61;"js/vue.js">script><script>const vm &＃61; new Vue({el: "#app",data: {message: "Hello Vue.js!"}})script>
body>
第一次接收数据时
修改数据
P.13.2 v-html 解析显示带有html标签的文本
<div id&＃61;"app"><h2>{{message}}h2><h2>{{url}}h2><h2 v-html>{{url}}h2><h2 v-html&＃61;"url">h2>
div><script>const vm &＃61; new Vue({el: "#app",data: {message: "Hello Vue.js!",url:&＃39;百度一下&＃39;}})
script>
P.13.3 v-text 更新元素的 textContent
{{message}}
{{message}}
P.13.4 v-pre 原样显示文本
<body><div id&＃61;"app"><h2>{{message}}h2><h2 v-pre>{{message}}h2>div><script>const vm &＃61; new Vue({el: "#app",data: {message: "Hello Vue.js!"}})script>
P.13.5 v-cloak 保持在元素上直到关联实例结束编译
<html><head><meta charset&＃61;"utf-8"><title>Titletitle><script src&＃61;"js/vue.js">script><style>[v-cloak]{display: none;}style>head><body><div id&＃61;"app"><h2>{{message}}h2><h2 v-cloak>{{message}}h2>div><script>setTimeout(function(){const vm &＃61; new Vue({el: "#app",data: {message: "Hello Vue.js!"}})}, 1000)script>body>
html>
P.14 v-bind 动态绑定 基本使用
v-bind
缩写 可以直接用 :(冒号)
动态地绑定一个或多个特性&＃xff0c;或一个组件 prop 到表达式。
从源码中可以看出只有红框指向的写法的才是有效的
P.15 v-bind 动态绑定class(对象语法)
P.16 v-bind 动态绑定class(数组语法)
P.17 作业 v-bind和v-for结合使用
P.18 v-bind 动态绑定style(对象语法)
{{message}}
{{message}}
{{message}}
P.19 v-bind 动态绑定style(数组语法)
{{message}}
P.20 computed 计算属性的基本使用
P.21 computed 计算属性的复杂使用
京公网安备 11010802041100号