根据来自API的数据更改类

Question

我用当前的答案更新了这个，它仍然没有改变UVIndex上的类

函数showUvIndex(数据){

let UVInumber = Math.round(data.current.uvi);
uvIndex.classList = "btn btn-lg";
if (UVInumber == 11) {
uvIndex.classList.add('extreme');
} else if ([8, 9, 10].includes(UVInumber)) {
uvIndex.classList.add('very-high');
} else if ([6, 7].includes(UVInumber)) {
uvIndex.classList.add('high');
} else if ([3, 4, 5].includes(UVInumber)) {
uvIndex.classList.add('moderate');
} else if ([0, 1, 2].includes(UVInumber)) {
uvIndex.classList.add('low');
};
console.log(UVInumber);

};

Answer 1

你在if语句中使用了错误的语法，你不能用这种方式将你的uvinnumber与一组值进行比较。

下面是一个有效的例子

if (UVInumber == 11) {
uvIndex.classList.add('extreme');
} else if ([8, 9, 10].includes(UVInumber)) {
uvIndex.classList.add('very-high');
} else if ([6, 7].includes(UVInumber)) {
uvIndex.classList.add('high');
} else if ([3, 4, 5].includes(UVInumber)) {
uvIndex.classList.add('moderate');
} else if ([1, 2].includes(UVInumber)) {
uvIndex.classList.add('low');
}

这里是一个更易于阅读的例子

const UVInumber = 10;
const classMap = [{
class: "extreme",
values: [11]
},
{
class: "very-high",
values: [8, 9, 10]
},
{
class: "high",
values: [6, 7]
},
{
class: "moderate",
values: [3, 4, 5]
},
{
class: "low",
values: [1, 2]
}
];
const classToAdd = classMap.find(x => x.values.includes(UVInumber)).class;
console.log(classToAdd)