“Vue el与data的两种写法”的版本间的差异
跳到导航
跳到搜索
Jihongchang(讨论 | 贡献) |
Jihongchang(讨论 | 贡献) |
||
第45行: | 第45行: | ||
//data 的第二种写法:函数式 | //data 的第二种写法:函数式 | ||
data: function (){ | data: function (){ | ||
+ | console.log('@@@', this); //此处的 this 是 Vue 实例对象 | ||
return { | return { | ||
name:'jay' | name:'jay' |
2024年7月28日 (日) 07:02的版本
https://www.bilibili.com/video/BV1Zy4y1K7SH?p=9
el 的第一种写法
第一种:new 的时候就传入 el 对应的容器
<script type="text/javascript">
new Vue({
el:'#root',
data:{
name:'jay'
}
})
</script>
el 的第二种写法
<script type="text/javascript">
const v = new Vue({
data:{
name:'jay'
}
})
console.log(v);
v.$mount('#root')
</script>
data 的第一种写法
对象式
<script type="text/javascript">
new Vue({
el:'#root',
data:{
name:'jay'
}
})
</script>
data 的第二种写法
函数式
<script type="text/javascript">
new Vue({
el:'#root',
//data 的第二种写法:函数式
data: function (){
console.log('@@@', this); //此处的 this 是 Vue 实例对象
return {
name:'jay'
}
}
})
</script>