vue3中对象数组scoreRanges:{0:1,1:1.5,2:2,3:2.5,4:3,5:3.5} 转变成常规数组arr:[]1,1.5,2,2.5,3.,3.5
时间: 2023-08-19 12:54:12 浏览: 178
在 Vue 3 中,你可以使用 `Object.values()` 方法将对象数组 `scoreRanges` 转换为常规数组。以下是一个示例代码:
```javascript
<template>
<div>
<!-- 界面内容 -->
</div>
</template>
<script>
import { ref } from 'vue';
export default {
setup() {
const scoreRanges = {0: 1, 1: 1.5, 2: 2, 3: 2.5, 4: 3, 5: 3.5};
const arr = ref([]);
for (const value of Object.values(scoreRanges)) {
arr.value.push(value);
}
console.log(arr.value);
return {
arr
};
}
};
</script>
```
在上述示例中,我们使用 `Object.values()` 方法来获取对象数组 `scoreRanges` 中的所有值,并使用 `for...of` 循环将这些值添加到常规数组 `arr` 中。
请注意,我们通过 `ref()` 创建了 `arr` 变量,以确保在其发生变化时能够触发响应式更新。最后,我们在控制台中输出 `arr.value` 来验证转换结果。
运行上述代码后,你会在控制台中看到转换后的常规数组 `arr` 的值为 `[1, 1.5, 2, 2.5, 3, 3.5]`。
阅读全文