什么是Vue指令
在vue中提供了了一一些对于?页面面 + 数据的更更为方方便便的输出,这些操作就叫做指令, 以v-xxx表示。
比如html?页面面中的属性 `<div v-xxx ></div>`;比如在angular中 以ng-xxx开头的就叫做指令;
在vue中 以v-xxx开头的就叫做指令,指令中封装了了一一些DOM行行行为, 结合属性作为一一个暗号, 暗
号有对应的值,根据不不同的值,框架会进行相关DOM操作,和数据的绑定。
v-text 和 v-html
{{}}和v-text的作用是一样的 都是插入值 直接渲染 innerText
v-html既能插入值 又能插入标签 innerHTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>指令之v-text和v-html</title>
</head>
<body>
<div id='app'>
<h1>{{ msg }}</h1>
<h2 v-text='msg'></h2>
<div v-html='htmlMsg'></div>
</div>
<script src="./vue.js"></script>
<script>
// {{}}和v-text的作用是一样的 都是插入值 直接渲染 innerText
// v-html既能插入值 又能插入标签 innerHTML
new Vue({
el:'#app',
data:{
msg:"插入标签",
htmlMsg:'<h3>小马哥</h3>'
}
})
</script>
</body>
</html>
版权声明:除特别注明外,本站所有文章均为王晨曦个人站点原创
转载请注明:出处来自王晨曦个人站点 » Vue_0.2 Vue指令