所有的指令都是属性，所以写的地方应该在标签里面。插值表达式只能写在双标签之间。
例如: <div v-text="msg"></div> 这个是指令书写的地方例如： <div>{{msg}}</div> 这个是插值表达式书写的地方v-text 作用：输出一段文本
v-html 作用：输出一段文本，但是如果里面有html结构，会解析出来，如果里面写了js，是解析不出来的，只能解析html
v-bind 作用：让冒号后面的属性值进行动态的绑定。可以动态绑定图片；可以动态绑定id号，可以动态绑定id号，用来删除这个id号的内容；可以动态绑定class，判断在什么情况的时候加这个样式，什么时候不加；
v-for 作用：
v-model 作用：
v-show 作用：
v-if 作用：
v-on 作用：
v-cloak 作用：
例子：插值表达式 v-text v-html 的演示
在标签内插入一段文字
template里面的结构
<template> <div> <div>{{msg}}</div> <!-- 插值表达式 --> <div v-text="msg"></div> <!-- v-text --> <div v-html="msg"></div> <!-- v-html --> </div></template>script里面的结构
<script>export default { data() { return { msg: "<button>文字</button>" //上面获取这里的数据 }; }};</script>效果图
v-bind 的演示
在图片标签内动态添加图片
template里面的结构
<template> <div> <img :src="src" alt=""> <!-- 动态添加图片 --> <a :href="'./del?id='+id">删除ID号{{id}}的成员</a> <!-- 删除这个ID号的成员 --> </div></template>script里面的结构
<script>export default { data() { return { src: "@/assets/img/login/wechat.png", //这里写你的图片路径 id: 5 //现在的ID号为5 }; }};</script>图片效果图
删除ID号效果图
