Bagaimana untuk menghantar tatasusunan ke belakang dalam vue? Pengenalan kaedah

Vue, sebagai rangka kerja JavaScript yang popular, telah digunakan secara meluas dalam pembangunan bahagian hadapan. Dalam Vue, apabila memproses input pengguna bahagian hadapan dan menyerahkan data ke bahagian belakang, kadangkala anda perlu menghantar tatasusunan ke bahagian belakang. Jadi, bagaimana untuk mencapainya?

1. JSON.stringify

Satu kaedah ialah menggunakan kaedah JSON.stringify() untuk menukar tatasusunan kepada rentetan format JSON, dan kemudian hantar rentetan itu ke hujung belakang.

Sebagai contoh, dalam Vue, jika anda ingin menghantar tatasusunan yang dipanggil myArray ke bahagian belakang, anda boleh menulis kod seperti ini:

methods: {
  postData: function () {
    const myArray = [1, 2, 3, 4, 5];
    const jsonData = JSON.stringify(myArray);
    axios.post('/post', jsonData)
      .then(response => {
        console.log(response);
      })
      .catch(error => {
        console.log(error);
      });
  }
}

Dalam contoh ini, kami lulus JSON. stringify() menukar tatasusunan myArray menjadi rentetan berformat JSON dan menghantarnya ke bahagian belakang sebagai data.

Sudah tentu, kaedah ini juga boleh dilaksanakan menggunakan perpustakaan permintaan HTTP lain, seperti jQuery.ajax() atau XMLHttpRequest().

2. Gunakan formData

Kaedah lain ialah menggunakan objek FormData untuk memproses data tatasusunan. FormData ialah API untuk menghantar data borang sebagai pasangan nilai kunci semasa menghantar permintaan HTTP.

Sebagai contoh, dalam Vue, anda boleh menulis kod seperti berikut:

methods: {
  postData: function () {
    const myArray = [1, 2, 3, 4, 5];
    const formData = new FormData();
    for (let i = 0; i < myArray.length; i++) {
      formData.append(&#39;myArray[]&#39;, myArray[i]);
    }
    axios.post(&#39;/post&#39;, formData)
      .then(response => {
        console.log(response);
      })
      .catch(error => {
        console.log(error);
      });
  }
}

Dalam contoh ini, kami menggunakan objek FormData untuk menambah setiap elemen tatasusunan kepada formData dan menamakannya ' myArray []'. Ini kerana di bahagian belakang, data yang diterima akan menjadi tatasusunan dan bukan rentetan mudah.

Kaedah ini boleh digunakan bukan sahaja untuk tatasusunan, tetapi juga untuk jenis data kompleks lain, seperti muat naik fail dan muat naik imej.

Ringkasnya, tidak kira kaedah mana yang digunakan, kaedah penerimaan program back-end mesti diambil kira. Dalam penggunaan sebenar, penghantaran data mungkin perlu dilaksanakan berdasarkan teknologi back-end yang berbeza, dan teknologi yang berbeza juga mungkin mempunyai keperluan format data yang berbeza. Begitu juga, apabila menggunakan Vue, anda perlu mempertimbangkan perbezaan antara versi yang berbeza dan interaksi antara komponen.

Atas ialah kandungan terperinci Bagaimana untuk menghantar tatasusunan ke belakang dalam vue? Pengenalan kaedah. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!