码迷,mamicode.com
首页 > 其他好文 > 详细

Vue2 实例中的 data 属性三种写法与作用:

时间:2018-09-12 18:04:59      阅读:163      评论:0      收藏:0      [点我收藏+]

标签:一模一样   实例   log   blog   语法   src   unp   复用   com   

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
    <span>{{count}}</span>
    <button @click="inc">+</button>
</div>
<script>
var app = new Vue({                               
  // 1. data () {                                    
  //     return {count: 0}                          
  //   },
  // 2.data: {
  //     count: 0
  //  },        
                             //和2在官方文档上都有例子,
                             //地址是:https://blog.csdn.net/baidu_31333625/article/details/70238611
                             //简而言之,在app = new Vue对象时,没什么区别,因为你app对象不会被复用
                             //
但是在组件中,因为可能在多处调用同一组件,
                             //所以为了不让多处的组件共享同一data对象,只能返回函数。
// 3.data: function() { //1是3的区别:1是3的语法糖,和1一模一样     return {      count: 0      }      }, methods: { inc () {this.count++} } }) app.$mount(#app) </script>

 

Vue2 实例中的 data 属性三种写法与作用:

标签:一模一样   实例   log   blog   语法   src   unp   复用   com   

原文地址:https://www.cnblogs.com/caoxueying2018/p/9636035.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!