पैरेंट

Question

से व्यू में घटकों के गणना गुणों तक पहुंचने से आप माता-पिता से वू में घटकों के गणना गुणों तक कैसे पहुंच सकते हैं?

इस उदाहरण में, मैं आइटम घटकों के साथ एक गाड़ी है और मैं गणना और गाड़ी आइटम का कुल योग प्रदर्शित करना चाहते हैं:

cart.js

var vm = new Vue({ 

    el: '#cart', 

    components: { 
    cartItem: require('./components/cart-item.js'), 
    }, 

    data: { 
    items: [ 
     { name: 'apple', qty: 5, price: 5.00 }, 
     { name: 'orange', qty: 7, price; 6.00 }, 
    ], 
    }, 

    computed: { 
    // I want to do something like this and access lineTotal from cart 
    cartTotal: function() { 
     return this.items.reduce(function(prev,curr) { 
     return prev + curr.lineTotal; 
     }, 0) 
    } 
    } 
}); 

गाड़ी-item.js

module.exports = { 
    template: require('./cart-item.template.html'), 
    props: ['fruit'], 
    computed: { 
     lineTotal: function() { 
     return this.fruit.price * this.fruit.qty; 
     } 
    }, 
}; 

मुख्य एचटीएमएल

<li v-for="item in items" is="cart-item" :fruit="item"> 

... 

@{{ cartTotal }} 

cartTotal को संक्षेप में उपयोग करने के लिए प्रत्येक कार्ट-आइटम के lineTotal गुणों का उपयोग कैसे करूं?

ध्यान दें कि मैं lineTotal में किए गए गणना को फिर से नहीं करना चाहता हूं बल्कि इसके बजाय गणना की गई संपत्तियों का उपयोग सीधे करें।

Answer 1

आपको बच्चों को नाम देना होगा, उदाहरण के लिए v-ref निर्देश के माध्यम से। फिर माता-पिता से आप this.$refs.mychild.myproperty