के साथ Vuejs नेस्टेड घटकों को मैं प्रत्येक पृष्ठ के लिए घोंसले विभिन्न घटकों को समाप्त करने जा रहा हूं। मेरे आवेदन में प्रत्येक पृष्ठ के लिए मेरे पास एक घटक दृश्य है। प्रत्येक पृष्ठ पर, अलग-अलग वू उदाहरण हैं जो मैंने स्लाइडर, टैबबर, कैरोसेल इत्यादि जैसे घटकों का पुन: उपयोग करेंगे।इन्यू-टेम्पलेट
मैं इसे पुन: स्थापित करने की कोशिश कर रहा हूं क्योंकि बहुत से व्यू उदाहरण एक दूसरे के साथ हस्तक्षेप कर रहे थे और मुझे एहसास हुआ कि मेरे पास केवल कई मुख्य घटकों के साथ एक मुख्य वू उदाहरण होना चाहिए।
यह वही है मैं अब तक की स्थापना की है है:
समस्या यह है कि यह घर दृश्य घटक लोड करने के बाद बंद हो जाता है। यह किसी भी नेस्टेड घटकों को लोड नहीं करेगा जब तक कि मेरे पास उनके लिए टेम्पलेट सेट न हो जो मैं नहीं करना चाहता क्योंकि मैं लैरावेल ब्लेड सिंटैक्स का लाभ लेना चाहता हूं और नियमित HTML का उपयोग नहीं करना चाहता हूं। प्लस मेरे सर्वर साइड सहायकों के सभी, आदि
जावास्क्रिप्ट:
var App = new Vue({
el: '#app',
attached: function() {
console.log('main app loaded');
},
components: {
'home-view': {
attached: function() {
console.log('home view loaded');
},
components: {
'home-slider': {
attached: function() {
console.log('homepage slider loaded');
},
components: {
'slider': {
template: '#slider-template',
replace: true,
attached: function() {
console.log('general slider component loaded');
},
components: {
'slide': {
template: '#slide-template',
replace: true,
props: ['index', 'text'],
attached: function() {
console.log('general slide component loaded');
}
}
}
}
}
}
}
}
}
});
HTML:
<script type="x-template" id="slider-template">
<div class="slider">
<content></content>
</div>
</script>
<script type="x-template" id="slide-template">
<div class="slide" id="slide{{ index }}">
{{ text }}
</div>
</script>
<div id="app">
<component is="home-view">
<div id="slideshow" v-component="slider" inline-template>
<slider>
<slide index="1" text="Slide #1"></slide>
<slide index="2" text="Slide #2"></slide>
</slider>
</div>
<p>More content specific to the homepage here.</p>
</component>
</div>
मैं इस overthinking जा सकता है, लेकिन किसी भी मदद/विचारों के लिए धन्यवाद!
मुझे लगता है कि यह क्या कर रहा है घटक इनलाइन की टेम्पलेट परिभाषित किया जाता है, न कि विलय माता-पिता और बच्चे टेम्पलेट्स। डेविड सही है। – jasonszhao