javascript - Wie kann ich die Abstimmungsoptionen in vue.js dynamisch erhöhen oder verringern?
某草草
某草草 2017-05-19 10:33:35
0
1
766

In der Vergangenheit wurde in jquery der DOM einer Abstimmungsoption manuell in eine Zeichenfolge geschrieben, und wenn dann auf die Schaltfläche „Element hinzufügen“ geklickt wurde, wurde die Append-Methode verwendet, um den DOM anzuhängen. Darf ich fragen, wie man diese Funktion in vue.js implementiert?

某草草
某草草

Antworte allen(1)
滿天的星座

楼主可以多读读Vue的官方文档,深入点理解数据绑定的概念就好了,直接上示例吧:

<!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>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage