我的应用程序使用以下类型的数据：
有些公司都有数据点列表.
每个数据点都有一个类型,每个公司只能有一个每种类型的数据点.
+Company_1
|
|--Datapoint_1 : type_1
|--Datapoint_2 : type_2
|--Datapoint_3 : type_3
|
|
+Company_2
|
|--Datapoint_4 : type_3
|--Datapoint_5 : type_2
|
|+Company_3
|
|--Datapoint_6 : type_2
...
...
总共有大约1000个数据点和20个公司.
该应用程序根据这些数据点计算分析,目标是允许用户操作这些数据点,以便查看给定方案中的结果.
在任何给定时刻,都有一个“selected_company”和“selected_type”,并且基于这两个选择,应该选择正确的数据点进行操作.
我意识到,如果“公司”变量和“数据点”属性是数组,则必须对所有项进行搜索才能找到正确的项.
因此,我选择将它们作为对象：
companies = {
'1' : {
name : 'Company_1',
datapoints : {
'type_1' : { ... },
'type_2' : { ... },
'type_3' : { ... }
}
},
'2' : {...},
'3' : {...},
.
.
.
}
问题：
我有一个’datapoint’组件,我将数据点作为道具传递：
在这个组件中,我有一个输入,用于操作数据点的score属性：
但是,这种输入表现出非常奇怪的行为.当我输入输入时,模型不会立即更新.相反,Vue似乎在等待我在更新模型之前从输入(onBlur)更改焦点.
更奇怪的是,当我将datapoints属性设为数组时
companies = {
'1' : {
name : 'Company_1',
datapoints : [
{ ... },
{ ... },
{ ... }
]
},
使用一种方法来检索数据点(而不是直接传入它),Vue以正确的方式运行！
(在js文件中:)
var app = new Vue({
el : '#app',
data:{...},
methods:{
getDatum: function(selected_company, selected_type){
var datum = this.companies[selected_company].datapoints.find(function(elem){
return elem.type == selected_type
})
return datun
}
}
})
我需要帮助理解为什么Vue在这种情况下表现得像这样,因为它对应用程序性能有一些严重的影响.
提前致谢.
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
