我似乎被困在试图return
从另一个计算属性内部的一个计算属性中调用值。
这是我的代码到目前为止的样子:
computed: {
myTime() {
var date = new Date(this.myData.doc[9].time);
return date.toString("YYYY MMM dd hh:mm").substring(0,24);
},
myName() {
return this.$store.getters.findName(this.id)
},
series() {
var series = [
{
name: "TMP",
data: [28, 29, 33, 36, 32, 32, 33]
},
{
name: "HUM",
data: [12, 11, 14, 18, 17, 13, 13]
},
{
name: "CO2",
data: []
}
];
for (var i = 0; i < 10; i++) {
series[2].data.push(((this.myData.doc[i].co2*10)*100)/3000);
}
return series;
},
myData() {
return this.$store.state.graphData.find(obj => obj.id == this.id)
},
...mapGetters({
}),
...mapState({
newSettings: 'newSettings',
graphDatagraphData'
}),
}
我正在做的是尝试根据这个例子绘制图表:https ://apexcharts.com/vue-chart-demos/line-charts/data-labels/
因为我想通过每隔几秒更新一次的实时提要动态更改这些数据,所以我已经移动了series
包含对象的数组,以便在图表上从data()
函数到computed:
属性列表制作更多线条。
是的,我对此进行了测试,移动后未更改,图表效果很好。
我的问题出现在我尝试myData
从计算属性中引用计算series
属性的地方。无论我如何)尝试它(this.myData
, this.myData()
, myData
, myData()
),它总是以未定义的形式返回。
我觉得这很不寻常,因为在前面的计算属性中myTime
,我引用this.myData.doc[].xxx
没有问题。
是的,这可能属于该this.$store.getters
部分,但我想知道为什么在调用和计算属性this.myData
之间存在差异。myTime
series
该myData
属性类似于:
{
id: "xxxxxxxxxxxxxx",
doc: [
{co2: 1800, tmp: 20, hum: 50},
{co2: 1800, tmp: 20, hum: 50},
{co2: 1800, tmp: 20, hum: 50},
{co2: 1800, tmp: 20, hum: 50},
{co2: 1800, tmp: 20, hum: 50},
{co2: 1800, tmp: 20, hum: 50},
]
}
所以它应该工作的方式是doc
从内部迭代数组myData
,提取 co2 值,并将其推送到series[i].data
图表将识别它的适当数组。
感谢所有建设性的意见!