zoukankan      html  css  js  c++  java
  • Vue data定义为函数的原因?

    var Vue = function () {};
    
    Vue.prototype.data = {a: 1, b: 2};
    
    var f1 = new Vue();
    
    var f2 = new Vue();
    
    f1.a = 3;
    
    console.log(f2.a) ; // 3
     

    首先看下上面这段代码,这是一种对象添加属性的方式。

    在函数或者类class上进行属性值扩展时,如果使用原型上直接扩展的方式,对象实例化时无法区分不同对象之间的值作用域,用对象的方式初始化data并不合适。

    var Vue = function () {
    
      this.data = this.datas();
    
    };
    
    Vue.prototype.datas = function () {
    
      return {
    
        c: 1,
    
        d: 2
    
     }
    
    }
    
    var v1 = new Vue();
    
    var v2 = new Vue();
    
    v1.c = 5;
    
    console.log(v2.c);  // 1
    

      在函数内声明实例属性报存data,每个实例对象的data都是经过一次函数执行得到有不同的返回结果,所以返回data的值具有自己独立的作用域。

    * 在定义Vue实例时,给Vue传参是一个对象,对象中data就是一个函数,Vue在实例化的时候会调用这个函数每个实例都会返回新的值,data得到不同的值作用域。

    另外,赋值函数不一定要定义在原型上,也可以定义为函数或类的实例方法。

  • 相关阅读:
    properties 插件安装
    FineReport 安装教程
    Red/Black Tree 演示
    java 日期转化
    Tomcat使用Log4j按天生成日志 亲测可行
    服务器初始化
    ubuntu-rc.local
    django-views
    https tcp ssl
    svn
  • 原文地址:https://www.cnblogs.com/the-last/p/11344109.html
Copyright © 2011-2022 走看看