当前位置：网站首页>el与data的

el与data的

2022-08-09 05:04:00 【魂＆梦】

el有两种写法：

new Vue时候配置el属性；

先创建Vue实例，随后再通过v.$mount('#root')指定el的值；

el两种写法的代码：

    const v = new Vue({
         el:'#root',第一种写法
         data:{
             name:'广州'
         }
     })
    console.log(v);

    setTimeout(() => {//等待一秒后执行
     v.$mount('#root')//第二种写法
    },1000)

data有两种写法：

对象式

函数式（代码中都有写法）

data两种写法的代码：

    new Vue({
        el:'#root',
        //data第一种写法：对象式
        // data:{
        //     name:'深圳'
        // }

        data第一种写法：函数式
        data(){
            console.log(this);//此处的this是vue实例对象
            return{
                name:'北京'
            }
        }
    })

如何选择：

目前那种方式都可以，用到组件时，data必须使用函数式，否则会报错；

一个重要的原则：

由Vue管理的函数，一定不要写箭头函数，一旦写了箭头函数，this就不是Vue实例了；

原网站

版权声明
本文为[魂＆梦]所创，转载请带上原文链接，感谢
https://blog.csdn.net/weixin_44564263/article/details/126234475