【VueJS】实例中data属性的三种写法及区别

一：对象写法

?

1 2 3 4 5 6 7 8

<script type="text/javascript">     var app=new Vue({         el:'#app',         data:{             isLogin: false         }     }) </script>

二：函数写法

?

1 2 3 4 5 6 7 8 9 10

<script type="text/javascript">     var app=new Vue({         el:'#app',         data: function(){             return {                 isLogin: false             }         }     }) </script>

　　三：函数的简写 （第3种是第2种的ES6写法）----可以统一使用第三种写法

?

1 2 3 4 5 6 7 8 9 10

<script type="text/javascript">     var app=new Vue({         el:'#app',         data() {             return {                 isLogin: false             }         }     }) </script>

　　

区别

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

2）但是在组件中，因为可能在多处调用同一组件，所以为了不让多处的组件共享同一data对象，只能返回函数。