vue.js senarai ke tatasusunan

WBOY
Lepaskan: 2023-05-24 09:00:08
asal
1115 orang telah melayarinya

Vue.js ialah rangka kerja JavaScript bahagian hadapan yang sangat popular. Ia menyediakan pembangun cara mudah untuk membina aplikasi satu halaman yang kompleks. Dalam Vue.js, tatasusunan biasanya digunakan untuk mewakili senarai, jadual data dan struktur data lain yang memerlukan penambahan atau pengalihan unsur secara dinamik.

Walau bagaimanapun, kadangkala, kita perlu menukar senarai Vue.js kepada tatasusunan JavaScript biasa. Ini boleh dilakukan dengan menggunakan fungsi terbina dalam Vue.js.

Vue.js menyediakan fungsi yang dipanggil "Vue.set()" untuk menukar nilai dalam objek data Vue.js. Fungsi ini menerima tiga parameter: objek, indeks dan nilai baharu. Menggunakan Vue.set() memastikan paparan dipaparkan semula Apabila objek diubah suai, Vue.js akan mengesan pengubahsuaian ini dan mengemas kini paparan.

Andaikan kami mempunyai senarai Vue.js yang mengandungi data berikut:

data: {
senarai: [

{name: 'John', age: 25},
{name: 'Mary', age: 30},
{name: 'Bob', age: 35},
Salin selepas log masuk
Salin selepas log masuk

]
}

Pada ketika ini, kami ingin menukar setiap objek dalam senarai kepada tatasusunan. Ini boleh dilakukan dengan menggunakan kaedah vm.$set() Vue.js. Kaedah vm.$set() membenarkan kami menambah sifat dinamik pada tika Vue.

Dalam contoh Vue, kita boleh menentukan tatasusunan kosong baharu untuk menyimpan objek senarai yang ditukar. Kami kemudiannya boleh menggunakan Vue.set() untuk meletakkan setiap objek senarai ke dalam tatasusunan kosong ini.

Berikut ialah contoh:

data: {
senarai: [

{name: 'John', age: 25},
{name: 'Mary', age: 30},
{name: 'Bob', age: 35},
Salin selepas log masuk
Salin selepas log masuk

],
arr: []
},
dicipta() {
this.list.forEach((item, index) => {

this.$set(this.arr, index, item);
Salin selepas log masuk

})
}

Dalam contoh ini, kami menggunakan Vue kaedah forEach() dalam js digunakan untuk mengulangi semua elemen dalam senarai. Untuk setiap elemen, cipta kedudukan baharu dalam tatasusunan kosong dan arahkannya ke elemen. Juga, gunakan kaedah vm.$set() untuk memastikan lokasi baharu ini ditambahkan pada tika Vue.js.

Kini, kami telah berjaya menukar senarai Vue.js kepada tatasusunan JavaScript. Kita boleh menggunakan tatasusunan ini dalam templat untuk menyimpan data dan bukannya menggunakan senarai Vue.js.

Ringkasan:

Dalam Vue.js, gunakan kaedah Vue.set() untuk menukar senarai kepada tatasusunan. Ini memastikan bahawa paparan dipaparkan semula dan harus digunakan dalam situasi di mana aplikasi Vue.js perlu menambah atau mengalih keluar elemen secara dinamik. Dengan menggunakan kaedah Vue.set(), anda boleh menggunakan tatasusunan JavaScript biasa untuk menyimpan data dan bukannya perlu menggunakan senarai Vue.js.

Atas ialah kandungan terperinci vue.js senarai ke tatasusunan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!