vue ：v-text和v-html的区别和使用

首先新建一个小demo
html

<div id="app">
	<div>{{name}}</div>
	<div v-text="name"></div>
	<div v-html="name"></div>
</div>

js

var app = new Vue({
		el:'#app',
		data:{
			name:"<h1>Min</h1>"
		}
	})

我们由此可以看出v-html和v-text的区别，v-html会自动解析h1标签，v-text不会

在v-text等v开头的指令后面所跟的其实都是js表达式，在其中我们不仅可以加一些变量，还可以加字符串
我们对上面的html代码和js代码进行修改
html

<div id="app">
		<div>{{name + ' min'}}</div>
		<div v-text="name + ' min'"></div>
		<div v-html="name + ' min'" ></div>
</div>

js

<script>
		var app = new Vue({
			el:'#app',
			data:{
				name:"Min"
			}
		})
</script>