Composant de modèle ComboBox utilisant VueJS

Question

我想使用 vuejs v3 制作一个 Combobox 模板组件，为此我有以下代码：

Answer 1

Je vois beaucoup de choses, pour répondre clairement à votre question, v-for est utilisé sur les éléments.

<template>
    // For mor readability i recommend you do bind your property:
    //  - name={{selector_name}} become :name="selector_name"
    <select :name="selector_name" class= "combobox" :id="selector_id">
        <!-- v-for is required with a unique key, you can take the index and use it -->
        <option v-for="(opt, index) in selector_options" :key="`opt ${index}`" value=opt>
           {{ opt }}
        </option>
    </select>
</template>

Vous ne pouvez pas définir d'accessoires et de données portant le même nom. Props, injectez des propriétés et des valeurs dans les données. Exactement pareil, mais les données proviennent du parent et vous transmettez les valeurs du parent à l'enfant.

Donc, si vous devez transmettre des données, utilisez des accessoires mais ne les définissez pas dans les données.

Il existe un exemple fonctionnel tout cela (j'ai utilisé des données au lieu d'accessoires pour améliorer la lisibilité).