javascript - Vue 键的类型转换 v-for

Question

我正在根据我提供组件的范围创建一个 v-for 列表:

<div class="checkbox" v-for="(value, key) in range">

我将我的数据作为 Prop 提供，如下所示:

"{ 0: '0 stars', 1: '1 star', 2: '2 stars' }"

尽管当我记录 typeof 时，我的 v-for 键将始终设置为字符串。这很奇怪，因为我传递的对象将 key 保存为数字而不是字符串。

当我将 key 传递给方法时，我不想不断地对其进行类型转换。有没有一种方法可以轻松地输入它？

还有什么可能导致它以字符串而不是整数的形式出现？

每当我 console.log 我的 range 对象时，键都会显示为紫色，所以我猜测此时它们仍然被视为整数？

Answer 1

在 JavaScript 对象中，键始终是字符串。如果您提供的键不是字符串，那么 JavaScript 会自动将其转换为字符串。 AFAIK 这是设计选择。参见 Object.keys()

您可以将索引作为第三个参数传递，如下所示:

<div class="checkbox" v-for="(value, key, index) in range">

并将索引传递给您的方法，但 vuejs 警告( here) :

迭代对象时，顺序基于 Object.keys() 的键枚举顺序，不保证在各个 JavaScript 引擎实现中保持一致。

最好像这样进行转换 myMethod(Number(key))