Question

我有一个无法解决的快速问题。我有问题，我有组件SelectForm.vue（它是带有按钮的表单），现在我想在按钮上单击（在此SelectForm.vue组件中）制成另一个相同的组件（在SelectForm上单击按钮使另一个组件在SelectForm下）。有可能吗？

Answer 1

创建一个显示所有SelectForm组件的包装器组件。在第一个表单上单击按钮时，emit一个事件，在包装器中侦听它，然后在其中创建一个新事件。

Vue.component('Wrapper', {
    template: `<div>
        <SelectForm v-for="(form, index) in numForms" @new="numForms++" />
    </div>`,
    data() {
        return {
            numForms: 1
        }
    }
})

Vue.component('SelectForm', {
    template: `<div>
        The Form<br />
        <button @click="$emit('new')">Duplicate</button>
    </div>`
});

new Vue({
    el: "#app"
})

这里是Java Platform Specification

Answer 2

如果组件必须呈现自身，则Vue允许递归组件。

https://vuejs.org/v2/guide/components-edge-cases.html#Recursive-Components

Vue在同一组件中创建组件

2 个答案: