vue 组件小例子 this.$parent
Posted ydam
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue 组件小例子 this.$parent相关的知识，希望对你有一定的参考价值。
<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--
}
}
}
以上是关于vue 组件小例子 this.$parent的主要内容，如果未能解决你的问题，请参考以下文章
Vue学习15----父组件主动获取子组件的数据和方法，子组件主动获取父组件的数据和方法
Vue.js - 当子组件在 <transition> 内时，无法访问 this.$parent