Rumah > Soal Jawab > teks badan
Selepas mengklik butang dalam kod berikut, kandungan tatasusunan app.items2 berubah, dan ul kedua juga diberikan kepada li, tetapi item.message dalam item2 tidak dipaparkan Mengapa ini dan cara menyelesaikannya ?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
</style>
</head>
<body>
<p id="example-1">
<ul>
<li v-for="item in items">
{{ item.message }}
</li>
</ul>
<ul>
<li v-for="item in items2">{{ item.message }}</li>
</ul>
<button @click="aaa">移动</button>
</p>
<script src="http://vuejs.org/js/vue.js"></script>
<script>
var app = new Vue({
el: '#example-1',
data: {
items: [{
message: 'Foo'
}, {
message: 'Bar'
}],
items2: []
},
methods: {
aaa: function() {
this.items2.push(this.items.splice(0, 1));
}
}
})
</script>
</body>
</html>
伊谢尔伦2017-05-19 10:23:07
Array.prototype.splice() Nilai pulangan Tatasusunan yang terdiri daripada elemen yang dipadam. Jika hanya satu elemen dialih keluar, tatasusunan yang mengandungi hanya satu elemen akan dikembalikan. Jika tiada unsur dialih keluar, tatasusunan kosong dikembalikan.
https://developer.mozilla.org...
this.items2.push(this.items.splice(0, 1)[0]);
https://jsfiddle.net/ycloud/n...
黄舟2017-05-19 10:23:07
Kaedah splice mengembalikan tatasusunan
push menerima parameter panjang berubah-ubah
Anda boleh menggunakan kaedah concat
this.items2 = this.items2.concat(this.items.splice(0, 1));