javascript - Existe-t-il un moyen de rendre efficaces les composants assemblés par Vue?

Question

Element-ui est utilisé dans le projet. Par exemple, je souhaite générer dynamiquement N composants.
<modèle>

<p class="search" ref="search" v-html="sHtml">

</p>

</modèle>

<script type="text/javascript">

export default {
    data() {
        return {
            sHtml: '',
        }
    },
    props: {
        con: {
            type: Array
        }
    },
    created() {
        this.con.map((v, i) => {
            this.sHtml += '<el-'+ v.type +' class="'+ v.style +'" placeholder="'+ v.placeholder +'" v-model="'+ v.name +'"></el-' + v.type +'>';
        });
    },
}

</script>

Existe-t-il un moyen d'afficher le plug-in d'élément sur la page ?

Answer 1

Vous ne pouvez pas rechercher directement l'endroit où le composant est référencé ? .

Answer 2

Tu ne peux pas être plus direct, comme

    
 
 <p class="search" ref="search">
     <el-input  v-model="keyFrom.id" size="small" placeholder="请输入内容"></el-input>
 </p>

Answer 3

La compilation HTML n'est pas prise en charge pour le moment, mais elle sera possible dans la version 1.0

Answer 4

Utilisez v-for directement pour restituer les composants via data [array]

Answer 5

Vous pouvez vous référer à : https://cn.vuejs.org/v2/guide...Composants dynamiques

<component v-for="item in con" :is="item.name"></component>