Vue中组件之间数据的传递的示例代码

import Vue from "vue";

const MyCompo = Vue.extend({
  template : `
    

      
我是MyCompo组件，我的a值是{{a}}
      
子组件c：{{c}}
      
    
  `,
  props : ["c"],
  data : function(){
    return {
      a : 1, 
      b : 2
    }
  },
  methods : {
    add : function(){
      this.a ++;
    }
  }
});

export default MyCompo;

import Vue from "vue";

const MyCompo = Vue.extend({
  template : `
    

      
我是MyCompo组件，我的a值是{{a}}，我的c值是：{{c}}
      

    
  `,
  props : ["c"],
  methods : {
    add : function(){
      this.c ++;
    }
  }
});

export default MyCompo;

import Vue from "vue";
import MyCompo from "./components/MyCompo.js";

new Vue({
  el : "#app",
  data : {
    c : 333,
    d : {
      v : 8888
    }
  },
  components : {
    "my-compo" : MyCompo
  }
});

  
  


  

    
我是父亲，我的c： {{c}} ，我的d:{{d | json}}
     
  

  

props : {
    "c" : null,
    "d" : null,
    "e" : {
      type : Number,
      required : true
    }
},