<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
</div>
<script src="vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el:"#app",
template:`
<div>
<div v-text=‘mytext‘></div>
</hr>
<div v-html=‘myhtml‘></div>
</hr>
<button v-if=‘num==1‘>测试v-if</button>
<button v-else-if=‘num==2‘>测试v-else-if</button>
<button v-else=‘num‘>测试v-else</button>
<div v-show=‘checkshow‘>v-show</div>
<ul>
<li v-for=‘(item,index) in arrayfor‘>
{{index}}-{{item}}
</li>
</ul>
<ul>
<li v-for=‘(value,key,index) in objfor‘>
{{index}}-{{key}}-{{value}}
</li>
</ul>
</div>
`,
data:function(){
return{
mytext:"<h1>我这是v-text</h1>",
myhtml:"<h1>我这是v-html</h1>",
num:2,
checkshow:true,
arrayfor:[‘篮球‘,‘足球‘,‘乒乓球‘],
objfor:{name:‘jj‘,age:16}
}
}
})
</script>
</body>
</html>
原文：https://www.cnblogs.com/xl4ng/p/12577774.html