📝【Vue】学习养成记，【程序员必备小知识】
📔 今日小知识——Vue常用指令之v-text
Vue.jpeg
目录
v-text指令，从这个指令我们不难看出，这个肯定就是文本有关系的(因为有text哈哈😁)，没错v-text指令其实就是设置标签的文本值的（textContent）。
1.v-text该怎么使用呢？？？
我们先在被vue实例挂载的标签div中，放入一个h3标签，在h3标签内部写入v-text指令，
<h3 v-text="name"></h3>那么name的值哪里来呢？
这就需要在data中去定义了，这样h3标签的值就是name的值了，如下代码：
<body>
<div id="app">
<h3 v-text="name"></h3>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
var app = new Vue({
el:"#app",
data:{
name:"周杰伦"
}
})
</script>
</body>
注意：但是这种使用的话还是会有一个缺点，就是不管你h3标签里面原来的值是什么，都会被替换成name的值，所以想要不被替换的话，就用另一种方法：插值表达式
2.插值表达式
插值表达式的写法是这样子的👉{{ name }}，你只要把它写在标签的内部就可以了，它只会把大括号内的name属性的值去进行替换，那么我们来测试，看一下结果如何，如下图所示：
image
我们还可以对它进行字符串的拼接，如下图所示：
image
3.总结：
-
v-text指令的作用是：设置标签的内容 -
v-text指令默认写法会替换标签的全部内容，使用插值表达式{{}}可以替换指定的内容 -
v-text指令内部支持表达式
Vue 官方文档：http://vuejs.org/v2/guide/syntax.html
Vue 中文文档: https://cn.vuejs.org/v2/guide/syntax.html
4. 写在后面
关注我，更多内容持续输出
🌹 喜欢就点个赞吧👍🌹
🌹 觉得有收获的，可以来一波 收藏+关注，以免你下次找不到我😁🌹
🌹欢迎大家留言交流，批评指正，
转发请注明出处，谢谢支持！🌹
