<body> <div id="app"> <goods :name='name' :price='price' :num='num'></goods> <!--进行原始的点击事件 局部注册--> </div> </body>
var vm = new Vue({ el: "#app", data: { name: "苹果", price: 10, num: 1 }, components:{ "goods":goods } }); var goods = { template: "<div><p>名字：{{name}}</p><p>价格：{{price}}</p><p>数量：{{num}}</p><p>总价：{{totle}}</p><br /><button @click='jia' >+</button><br /><button @click='jian'>-</button></div>", props: ["name",'price','num'], computed:{ totle:function(){ console.log(this) return this.num*this.price } },methods: { jia: function() { this.$parent.num++ zhixiang指向vm.num }, jian: function() { this.$parent.num-- } } }