<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 属性三种写法与作用:的更多相关文章

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

    <script src="https://unpkg.com/vue/dist/vue.js"></script> <div id="app ...

  2. Struts2中Action类的三种写法

      一.普通的POJO类(没有继承没有实现)-基本不使用 POJO(Plain Ordinary Java Object)简单的Java对象,实际就是普通JavaBeans,是为了避免和EJB混淆所创 ...

  3. 3.Struts2中Action类的三种写法

    一.普通的POJO类(没有继承没有实现)-基本不使用 public class DemoAction1 { public String execute(){ System.out.println(&q ...

  4. DataSnap高级技术(7)—TDSServerClass中Lifecycle生命周期三种属性说明

    From http://blog.csdn.net/sunstone/article/details/5282666 DataSnap高级技术(7)—TDSServerClass中Lifecycle生 ...

  5. android中解析文件的三种方式

    android中解析文件的三种方式     好久没有动手写点东西了,最近在研究android的相关技术,现在就android中解析文件的三种方式做以下总结.其主要有:SAX(Simple API fo ...

  6. vue定义data的三种方式与区别

    在vue中,定义data可以有三种写法. 1.第一种写法,对象. var app = new Vue({ el: '#yanggb', data: { yanggb: 'yanggb' } }) 2. ...

  7. Vue组件中的data属性

    Vue中的data属性专门用来以对象方式存放数据,它有两种用法. var vm=new Vue({ data:{a:1,b:2,}, }) var vm=new Vue({ data(){return ...

  8. Hibernate中Java对象的三种状态

                                                                                     Hibernate中Java对象的三种 ...

  9. 链接属性rel=’external’、rel=’nofollow’、rel=’external nofollow’三种写法的区别

    链接属性rel='external'.rel='nofollow'.rel='external nofollow'三种写法的区别   大家应该都知道rel='nofllow'的作用,它是告诉搜索引擎, ...

随机推荐

  1. Abp.Linq.Extensions扩展(1)--static class QueryableExtensions

    // 摘要:        //     Used for paging with an Abp.Application.Services.Dto.IPagedResultRequest object ...

  2. (转)Linux netstat命令详解

    简介 Netstat 命令用于显示各种网络相关信息,如网络连接,路由表,接口状态 (Interface Statistics),masquerade 连接,多播成员 (Multicast Member ...

  3. h5标签兼容

    <!--[if lt IE 9]> <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.js"> ...

  4. Linux线程池的实现

    线程池的实现 1:自定义封装的条件变量 //condition.h #ifndef _CONDITION_H_ #define _CONDITION_H_ #include <pthread.h ...

  5. Java - 35 Java 实例

    Java 实例 本章节我们将为大家介绍 Java 常用的实例,通过实例学习我们可以更快的掌握 Java 的应用. Java 环境设置实例 Java 实例 – 如何编译一个Java 文件? Java 实 ...

  6. Vue学习记录(二)

    一.指令 指令是Vue.js中一个重要的特性,主要提供了一种机制将数据的变化映射为DOM行为.当数据变化时,指令会依据设定好的操作对DOM进行修改,这样就可以只关注数据的变化,而不用去管理DOM的变化 ...

  7. 点击DIV随机换颜色

    <!DOCTYPE html> <html>     <head>         <meta charset="UTF-8">   ...

  8. Java调用Jenkins接口实现远程发版

    主要有以下几个要点: 1.在 Manage Jenkins 中设置Configure Global Security(主要是设置CSRF Protection中的prevent cross site ...

  9. raw格式和qcow2格式

    Raw: "raw" 镜像格式是最最简单的,并且是被 KVM 和 Xen 原生支持的格式,你 可以想象裸格式镜像和块设备文件是二进制位相当的,就好像从块设备拷 贝过来的,比方说,使 ...

  10. js:浏览器插件

    1.chrome background.js //chrome.webRequest.onBeforeRequest.addListener(function(info) { // chrome.ta ...