<div id="root">
<!-- 插值语法:用于解析标签体内容,可以是js表达式 -->
<h1>Hello,{{name}}</h1>
<h1>Hello,{{i+5}}</h1>
<!-- 指令语法:用于解析标签,也可以写js表达式 -->
<a v-bind:href="school.url">我的名字叫{{school.name}}</a>
</div>
<script type="text/javascript">
Vue.config.productionTip = false;
//创建Vue实例
new Vue({
el: '#root',
//用于指定Vue为哪一个容器服务,值通常为css选择器字符串
// el: document.getElementById('root')
data: {
i: 5,
name: '西南大学',
school: {
name: '卢航我儿',
url: 'https://lzkpersonal.com.cn'
}
}
//data用于存放数据,数据供el所指定容器服务
})
</script>
模板语法(插值语法和指令语法)
- 本文链接: http://lzkpersonal.com.cn/2023/06/22/1-模板语法-插值语法和指令语法/
- 版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!