masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
javascript - Bagaimana untuk meningkatkan atau mengurangkan pilihan pengundian secara dinamik dalam vue.js?
某草草
某草草 2017-05-19 10:33:35
0
1
764

Pada masa lalu, dalam jquery, DOM pilihan undian ditulis secara manual ke dalam rentetan, dan kemudian apabila butang "Tambah item" diklik, kaedah tambah digunakan untuk menambahkan DOM. Bolehkah saya bertanya bagaimana untuk melaksanakan fungsi ini dalam vue.js?

某草草
某草草

membalas semua(1)
滿天的星座
滿天的星座2017-05-19 10:35:35 Tingkat 1

Anda boleh membaca lebih banyak dokumentasi rasmi Vue dan memahami konsep pengikatan data secara mendalam Mari kita terus ke contoh: 

<!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>
Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan