标签：语法 click charset code ESS html strong v-once 标签
一次性插入，不再修改：v-once
<body>
<div id="app">
<h1>{{message}}</h1>
<h1 v-once>v-once：{{message}}</h1>
<button type="button" @click="changetext">改变文字</button>
</div>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
message:"hello Vue"
},
methods:{
changetext:function(){
this.$data.message="hello world"
}
}
})
</script>
</body>
插入html标签：v-html
<body>
<div id="app">
<!-- 不会读取标签，全部以文本形式展示 -->
<h1>{{htmlTxt}}</h1>
<!-- 以html标签形式被读取 -->
<h1 v-html="htmlTxt"></h1>
</div>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
htmlTxt:‘<span>hello</span>‘
}
})
</script>
</body>
绑定动态属性：v-bind（可直接省略，用“：”代替）
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
#login{
background-color: aqua;
}
#register{
background-color: palevioletred;
}
</style>
</head>
<body>
<div id="app">
<h1 v-bind:id="idname">hallo</h1>
<button @click="changeId">修改id</button>
</div>
<script src="js/hello.js"></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
idname:"login"
},
methods:{
changeId:function(){
this.idname="register"
}
},
})
</script>
</body>
</html>
标签：语法 click charset code ESS html strong v-once 标签
原文地址：https://www.cnblogs.com/by-young/p/12906960.html
