脚本宝典收集整理的这篇文章主要介绍了[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 {
        ...
    }
}

脚本宝典总结

以上是脚本宝典为你收集整理的[VueJS]实例中data属性的三种写法及区别全部内容，希望文章能够帮你解决[VueJS]实例中data属性的三种写法及区别所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。