[VueJS]实例中data属性的三种写法及区别

1、__

<script type=”text/javascript”>

var app=new Vue({
    el:'#app',
    data:{
        isLogin: false
    }
})

</script>
2、__

<script type=”text/javascript”>

var app=new Vue({
    el:'#app',
    data: function(){
        return {
            isLogin: false
        }
    }
})

</script>
3、__

<script type=”text/javascript”>

var app=new Vue({
    el:'#app',
    data() {
        return {
            isLogin: false
        }
    }
})

</script>
第3种是第2种的ES6写法

区别
1)在简单的Vue实例中,没什么区别,因为你app对象不会被复用。

var app = new Vue({…})
2)但是在组件中,因为可能在多处调用同一组件,所以为了不让多处的组件共享同一data对象,只能返回函数。

export default{

data(){
    return {
        ...
    }
}
    原文作者:yang
    原文地址: https://segmentfault.com/a/1190000018671912
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞