Vue.js 当值存在时，vue中的计算值不会加载到模板

我在vue中首先看到了这个问题。我有一个计算属性：

numfstudentspersubject（）{
让res=[]
for（让我们看看这个主题的主题）{
let key=subject.superSubject.trim（）
res[key]=0
为了（让学生了解这个。学生们）{
让studentSubject=student.subjects.find（（x）=>x.superSubjectName==key）
if（学生主题）res[关键]++
}
}
console.log（res）
返回res
}

记录到屏幕上的结果如下：

[Letters Recognition: 8, Listening - First Letter: 8, Listening - Letters: 0, Reading Comprehension - Sentences: 8, Reading Comprehension - Story: 8, …]

---

但当我尝试将数据pint到屏幕上时，如：

{{numOfStudentsPerSubject}

无论我做什么，它都会显示一个空数组

[]

。有人知道是什么导致了这样的问题吗？

首先，你应该使用对象而不是数组。数组是数字索引，而不是键索引，而对象是键值对的集合

其次，您返回的是该数组，而Vue模板需要一个字符串，因此仅调用默认为

[]

的数组上的toString，因为您没有任何有效的索引可枚举

在模板中使用对象时，切换到使用对象并将该对象字符串化（或使用其他方法将其转换为字符串）

const obj={
“示例1”：4，
“示例2”：7
}
console.log（obj.toString（））
console.log（JSON.stringify（obj））

首先，您应该为

res

使用对象，而不是数组。数组是数字索引，而不是键索引，而对象是键值对的集合

其次，您返回的是该数组，而Vue模板需要一个字符串，因此仅调用默认为

[]

的数组上的toString，因为您没有任何有效的索引可枚举

在模板中使用对象时，切换到使用对象并将该对象字符串化（或使用其他方法将其转换为字符串）

const obj={
“示例1”：4，
“示例2”：7
}
console.log（obj.toString（））
console.log（JSON.stringify（obj））

即使我将

return res

更改为

return'1'

它也不会打印任何内容，即使我将

return res

更改为

return'1'

它也不会打印任何内容