Vue 学习笔记(四)——vue的data选项使用注意
一、实例化组件时,挂载选项data 必须是函数,使用函数每次返回值都是一个新对象例如:<body><div id="app"><my-div></my-div></div><script type="text/tem
·
一、实例化组件时,挂载选项data 必须是函数,使用函数每次返回值都是一个新对象
例如:
<body>
<div id="app">
<my-div></my-div>
</div>
<script type="text/template" id="my_div">
<div>
<img src="img/1.jpg" width="300px" height="200px" />
<p>{{message}}</p>
</div>
</script>
<script>
//实例化组件
Vue.component('my-div',{
template:'#my_div',
data:{
message:'雨后的昆明'
}
});
new Vue({
el:'#app',
data:{
}
})
</script>
</body>
运行:
修改之后:
//实例化组件
Vue.component('my-div',{
template:'#my_div',
data() {
return{
message:'雨后的昆明'
}
}
});
更多推荐
已为社区贡献3条内容
所有评论(0)