recherche

Maison  >  Questions et réponses  >  le corps du texte

javascript - Comment augmenter ou diminuer dynamiquement les options de vote dans vue.js?

Dans le passé, dans jquery, le DOM d'une option de vote était écrit manuellement dans une chaîne, puis lorsque le bouton "Ajouter un élément" était cliqué, la méthode append était utilisée pour ajouter le DOM. Puis-je demander comment implémenter cette fonction dans vue.js ?

某草草某草草2804 Il y a quelques jours788

répondre à tous(1)je répondrai

  • 滿天的星座

    滿天的星座2017-05-19 10:35:35

    Vous pouvez lire davantage de la documentation officielle de Vue et comprendre en profondeur le concept de liaison de données. Passons directement à l'exemple :

    . 
    <!DOCTYPE html>
<html>
<head>
    <title>Welcome to Vue</title>
    <meta charset="utf-8">
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
    <p id="app">
        <p>投票</p>
        <template v-for="(item, index) in options">
            <input type="radio" name="vote" :value="item" v-model="vote">
            <label for="vote">选项{{ index }}</label>
        </template>
        <p>
            <button @click="newOption">增加选项</button>
        </p>
    </p>

    <script>
        new Vue({
            el: '#app',
            data: {
                options: [
                    '1',
                    '2'
                ],
                vote: '1'
            },
            methods: {
                newOption() {
                    this.options.push(this.options.length.toString());
                }
            }
        })
    </script>
</body>
</html>

    répondre
    0
  • Annulerrépondre