Bagaimana untuk menghantar berbilang permintaan menggunakan axios?
P粉316110779
P粉316110779 2024-03-26 21:18:41
0
1
356

Saya sedang membuat pendaftaran reaksi dengan beberapa medan (idStudent (kunci utama dan auto-kenaikan), nama pertama, nama keluarga, ..., guru, prasyarat) dan saya menggunakan Formik & yes untuk pengesahan .

Kemudian, saya terpaksa memautkan permohonan saya dengan sistem pengesyoran (mencadangkan projek tahun akhir kepada pelajar) berdasarkan prasyarat dan gred yang diperolehi dalam mata pelajaran tertentu.

Pada mulanya, saya hanya menggunakan satu jadual untuk menyimpan data daripada borang bahagian hadapan,

Pelajar (nama pertama, nama keluarga, ..., prasyarat)

Pelajar boleh memilih prasyarat daripada pemilihan respons yang mengandungi prasyarat mengikut pengajar (cth: jika pelajar belajar Sains Komputer, pemilihan respons hanya akan menunjukkan prasyarat Sains Komputer seperti React, Angular, Machine Learning...). Memandangkan pelajar boleh mempunyai berbilang prasyarat, lajur prasyarat dalam jadual pelajar akan mengandungi berbilang id untuk prasyarat yang dipilih, Prasyarat disimpan dalam jadual lain dalam pangkalan data saya (prasyarat(idFakulti, idPrasyarat, prasyarat)) Saya tahu bahawa saya boleh menggunakan fail JSON untuk menyimpan berbilang id dalam lajur, tetapi selepas melakukan beberapa penyelidikan tentang Stackoverflow dalam beberapa catatan sebelumnya, saya mendapati pemprosesan JSON adalah sukar, terutamanya jika saya ingin mengemas kini lajur. Jadi saya mencipta jadual lain untuk menyimpan prasyarat yang dipilih oleh pelajar semasa mendaftar

(studentPrecession(idStd(asing kunci rujukan idPelajar daripada jadual pelajar), idPrecession(asing kunci rujukan idPrecession daripada jadual prasyarat))

Masalah yang saya hadapi ialah bagaimana untuk menghantar permintaan untuk dua jawatan melalui axios, memandangkan Terfikir mungkin saya harus menggunakan gelung untuk menyimpan berbilang baris sekiranya pelajar memilih berbilang prasyarat.

Inilah yang saya lakukan:

Fail bahagian belakang saya

app.post("/registerStudent", (req, res) => {
  const faculty = req.body.faculty;
  const firstName = req.body.firstName;
  const lastName = req.body.lastName;
  const phone = req.body.phone;
  const email = req.body.email;
  const password = req.body.password;
  db.query(
    "INSERT INTO students (email, password, firstName, lastName, faculty, phone) VALUES (?,?,?,?,?,?)",
    [email, password, firstName, lastName, filiere, phone],
    (err, result) => {
      if (err) {
        console.log(err);
      } else {
        // store chosen prerequisites
        //result.insertId is the current idStudent of the student who registering
        const idStd = result.insertId;
        const idPrerequisite = req.body.idprerequis;
        db.query(
          "INSERT INTO studentPrerequisites (idStd, idPrerequisite) VALUES (?,?)",
          [idFiliere, idPrerequisite],
          (err, result) => {
            if (err) {
              console.log(err);
            } else {
              res.send("Values Inserted");
            }
          }
        );
      }
    }
  );
});

Kod bahagian hadapan saya

const onSubmit = (values, actions) => {
    Axios.post("http://localhost:3001/registerStudent", {
      faculty: values.faculty,
      firstName: values.firstName,
      lastName: values.lastName,
      phone: values.phone,
      email: values.email,
      password: values.password,
    })
      .then(() => {
       //preId is an array  that contains the selected prerequisites(id's) from react select  
       //I try to use a for loop to store multiple of prerequisites dynamically in case a 
       //student select multiple prerequisites
        for (let i = 0; i < preId.length; i++) {
            idPrerequisites: preId[i],
        }
      })
      .then(() => {
        console.log("success!");
      });
    actions.resetForm();
  };

P粉316110779
P粉316110779

membalas semua(1)
P粉976737101

Adalah lebih baik untuk membiarkan bahagian belakang mengendalikan berbilang prasyarat dengan menyerahkan pelbagai prasyarat kepada permintaan anda. Saya juga akan menggunakan Knex dan async/menunggu untuk mengelakkan banyak .then merantai dan mengambil kesempatan daripada urus niaga. Jika sebarang ralat berlaku dalam urus niaga, urus niaga akan menyambung semula semua pertanyaan. Knex juga menjadikannya sangat mudah untuk menanyakan pangkalan data anda dengan kaedah terbina dalam tanpa perlu menulis SQL mentah. Anda juga harus menggunakan penstrukturan objek dan bukannya melakukan firstName = req.body.firstName, lastName = req.body.lastName, dsb. Anda boleh mengetahui lebih lanjut tentang knex dan menyambungkan pangkalan data kepadanya di sini: https://knexjs.org/guide/#node-js Selain itu, mengapa anda tidak mencincang kata laluan anda? Ini sekurang-kurangnya keselamatan paling asas yang perlu anda lakukan!

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan