vue基础语法一
一、绑定数据
1、语法
<template>
<div >
<!--HTML获取绑定数据 -->
<h1>{{ msg }}</h1>
<h1>name :{{user.name}},age:{{user.age}}</h1>
<ul>
<li v-for="item in list">
{{item.name}}
</li>
</ul>
</div>
</template>
<script>
//数据格式
export default {
name: 'app',
data () {
return {
msg: 'Welcome to Your Vue.js App'
,user:{name:"jj",age:12}
,list:[{name:'ssdd'},{name:'llldd'}]
}
}
}
</script>注意循环数组时,需使用v-for,通过item参数循环获取数组值
<script>
export default {
name: 'app',
data () { //数据
return {
vuetitle: 'Welcome to Your Vue.js App'
,url:"http://www.baidu.com"
}
}
}
</script>
三、绑定HTML标签
通过data中的参数值,绑定对应的html标签
<div v-html="h">
<script>
export default {
name: 'app',
data () { //数据
return {
vuetitle: '<h>我是一个H标签<h/>'
}
}
}
</script>
- 上一篇 »javascript学习笔记-语法基础
- 下一篇 »PHP - 基础语法