目前为止,我们学过的指令:
v-bind:单向绑定解析表达式,可以简写为 :xxx
v-model:双向数据绑定
v-for:遍历数组 / 对象 / 字符串
v-on:绑定事件监听,可以简写为 @
v-if:条件渲染(动态控制节点是否存在)
v-else:条件渲染(动态控制节点是否存在)
v-show:条件渲染(动态控制节点是否展示)
v-text指令
作用:向其所在的节点中渲染文本内容
与插值语法的区别:v-text 会替换掉节点中的内容,{{xxx}} 则不会,更加灵活
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>v-text指令</title> <script type="text/javascript" src="../js/vue.js"></script> </head> <body> <!--准备好一个容器--> <div id="root"> <div>{{name}}</div> <div v-text="name"></div> </div> <script type="text/javascript"> // 阻止 vue 在启动时生成生产提示 Vue.config.productionTip = false new Vue({ el:"#root", data(){ return{ name:"马铃薯", } } }) </script> </body> </html>
标签:内置,渲染,19,text,绑定,指令,动态控制,节点 From: https://www.cnblogs.com/REN-Murphy/p/17728493.html