Pengeditan peta masa nyata: Petua dan kaedah untuk meneroka seatchart.js

Question

Saya sedang cuba mereka bentuk susun atur tempat menggunakan seatchart.js, adakah mungkin untuk mempunyai penyuntingan langsung pada pilihan carta tempat duduk?

Andaikan saya ingin menukar bilangan baris dan lajur dengan mengedit kotak teks, tetapi saya tidak nampak sebarang cangkuk atau fungsi yang boleh saya gunakan untuk memaparkan semula reka letak peta.

Ini adalah pilihan lalai saya, saya ingin menukar bilangan baris dan lajur.

const options = {
    map: {
      rows: 3,
      columns: 3,
      seatTypes: {
        default: {
          label: "Bronze",
          cssClass: "bronze",
          price: 80
        },
      },
      reserved: [],
      rowSpacers: [],
      columnSpacers: [],
      disabledSeats: [],
      reservedSeats: [],
    },
    cart: {
      visible: false
    },
  }

Saya mencipta borang ini dalam React

Borang susun atur

Saya menjangkakan peta akan dikemas kini selepas saya menukar bilangan baris/lajur.

Sebarang bantuan amat kami hargai.

Answer 1

Saya menukar perpustakaan saya kepada react-seat-picker dan hanya menambah kunci dalam tag SeatPicker, seperti ini

<SeatPicker
    key={randomKey}
...

Dan pastikan anda sentiasa menjana beberapa kunci rawak apabila nilai dikemas kini.