<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>模板语法</title>
<script src="js/vue.js"></script>
</head>
<body>
<!--模板语法1 插值表达式 以2个花括号开始的-->
<!--<div id="app">
{{name}}
<!--</div>-->
<div id="app">
<div>{{name +'lee'}}</div><!--//插值表达式和v-text功能是一致的-->
<div v-text="name + 'lee'"></div> <!--模板语法2 vue指令后面跟着一个值的时候，这个值不是字符串，是js表达式 让<div></div>标签内的内容换成vue实例里data里name变量里数据内容-->
<div v-html="name + 'lee'"></div> <!--将innerhtml里的内容与data里变量name下的内容进行绑定-->
</div>
</body>
<script>
var vm = new Vue({
el:"#app",
data:{
name:"<h1>dell</h1>"
}
})
</script>
<!--//当name变量里含有标签时，v-text不会理会标签的含义，直接当做文字输出，而v-html会翻译标签含义-->
<!--v-text v-html以及插值表达式里都可以写字符串-->
<html>
<head>
<meta charset="UTF-8">
<title>模板语法</title>
<script src="js/vue.js"></script>
</head>
<body>
<!--模板语法1 插值表达式 以2个花括号开始的-->
<!--<div id="app">
{{name}}
<!--</div>-->
<div id="app">
<div>{{name +'lee'}}</div><!--//插值表达式和v-text功能是一致的-->
<div v-text="name + 'lee'"></div> <!--模板语法2 vue指令后面跟着一个值的时候，这个值不是字符串，是js表达式 让<div></div>标签内的内容换成vue实例里data里name变量里数据内容-->
<div v-html="name + 'lee'"></div> <!--将innerhtml里的内容与data里变量name下的内容进行绑定-->
</div>
</body>
<script>
var vm = new Vue({
el:"#app",
data:{
name:"<h1>dell</h1>"
}
})
</script>
<!--//当name变量里含有标签时，v-text不会理会标签的含义，直接当做文字输出，而v-html会翻译标签含义-->
<!--v-text v-html以及插值表达式里都可以写字符串-->
</html>
扫一扫
274
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
