我有vue数据：
data: {
offices: requestData,
selectedFloors: [
"3",
"4",
"5",
"10",
"11",
"12",
],
minJobAngle: 0,
maxJobAngle: 80,
minAreaAngle: 0,
maxAreaAngle: 900
}
我需要使用选定的楼层来过滤表格行。过滤工作正常，但过滤器中选定楼层的顺序为 10, 11, 12, 3, 4, 5
我的方法中有这个函数
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;
});
}
这个计算不足
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;
},
这是我的 html
<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>
知道我缺少什么以及如何将这些楼层显示为 3、4、5、10、11、12？
例如，您需要使用
Number('3')将楼层转换为数字。这将在数字之间进行比较，而不是在字符串之间进行比较。当您比较字符串时，您将得到字母顺序排序（字典顺序），例如
10 < 2。这是固定排序函数：
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要了解有关类型转换的更多信息，请参阅此处：https://developer. mozilla.org/en-US/docs/Glossary/Type_Conversion
您正在比较字符串而不是数字。字符串
10、11、12低于2或3。在比较之前使用parseInt转换字符串。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; },