Isih nombor menggunakan Vue
P粉398117857
P粉398117857 2024-03-26 18:07:09
0
2
492

Saya mempunyai data vue:

data: {
          offices: requestData,
          selectedFloors: [
            "3",
            "4",
            "5",
            "10",
            "11",
            "12",
          ],
          minJobAngle: 0,
          maxJobAngle: 80,
          minAreaAngle: 0,
          maxAreaAngle: 900
        }

Saya perlu menapis baris meja menggunakan Tingkat Terpilih. Penapisan berfungsi dengan baik tetapi susunan lantai terpilih dalam penapis ialah 10, 11, 12, 3, 4, 5

Saya mempunyai fungsi ini dalam kaedah saya

getFilteredOffices() {
            const areaMin = this.sliderAreaMin;
            const areaMax = this.sliderAreaMax;
            const jobsMin = this.sliderJobMin;
            const jobsMax = this.sliderJobMax;
            const floors = this.selectedFloors;
            return this.offices.filter(function (item) {

              if (item.acf.suurus < areaMin || item.acf.suurus > areaMax) {
                return false;
              }
              if (item.acf.tookohad < jobsMin || item.acf.tookohad > jobsMax) {
                return false;
              }
              if (!floors.includes(item.acf.floor)) {
                return false;
              }
              return true;
            });
          }

Pengiraan ini tidak mencukupi

getAvailableFloors() {
            const set = new Set();

            const sorted = this.offices.sort((a, b) => {
              if (a.acf.floor > b.acf.floor) {
                return 1;
              }
              if (a.acf.floor < b.acf.floor) {
                return -1;
              }
              return 0;
            });

            sorted.forEach((office) => {
              set.add(office.acf.floor);
            });

            return set;
          },

Ini html saya

<label :class="['checkbox-label floor' + item]" v-for="item in this.getAvailableFloors">
   <input type="checkbox" name="floor" :value="item" v-model="selectedFloors"> @{{ item }}
   <span class="checkmark"></span>
</label>

Ada idea apa yang saya hilang dan cara memaparkan lantai ini sebagai 3, 4, 5, 10, 11, 12?

P粉398117857
P粉398117857

membalas semua(2)
P粉675258598

Sebagai contoh, anda perlu menggunakan Number('3') untuk menukar lantai kepada nombor. Ini akan membandingkan antara nombor, bukan rentetan.

Apabila anda membandingkan rentetan, anda mendapat susunan abjad (urutan leksikografi) seperti 10 < 2.

Ini ialah fungsi isihan tetap:

const sorted = this.offices.sort((a, b) => {
      const floorA = Number(a.acf.floor);
      const floorB = Number(b.acf.floor);
          
      if (floorA > floorB) {
           return 1;
      }
      
      if (floorA 

Untuk mengetahui lebih lanjut tentang penukaran jenis, lihat di sini: https://developer.mozilla.org/en-US/docs/Glossary/Type_Conversion

P粉182218860

Anda membandingkan rentetan bukan nombor. Rentetan 101112 低于 23。在比较之前使用 parseInt Tukar rentetan.

getAvailableFloors() {
  const set = new Set();

  const sorted = this.offices.sort((a, b) => {
    if (parseInt(a.acf.floor) > parseInt(b.acf.floor)) {
      return 1;
    }
    if (parseInt(a.acf.floor)  {
    set.add(office.acf.floor);
  });

  return set;
},
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan