Vue模板语法 插值语法与指令语法
模板语法
- 插值语法
- 指令语法
插值语法一般用于标签体中
指令语法一般用于标签属性,用于解析标签属性
v-bind是单向数据绑定, 即数据影响页面,反过来页面不会影响数据
<script src="../lib/vue.js"></script>
<body>
<div id="root">
<h1>插值语法</h1>
<span>hello,{{name}}</span>
<!-- <br> -->
<h1>指令语法</h1>
<!-- 主要用于动态绑定属性 -->
<a :href="url" target="_blank" rel="noopener noreferrer">跳转</a>
<a v-bind:href="url.toUpperCase()" target="_blank" rel="noopener noreferrer">跳转</a>
</div>
<script type="text/javascript">
const vue = new Vue({
el:'#root',
data:{
name:'island',
url:'//www.baidu.com'
}
})
</script>
</body>