高级图表-Vue图表选项在设置后不会更改值。
我正在使用高级图表-vue在我的Vue项目中拥有高级图表。
A) (首先，在javascript中的以下工作
let b =5;
let data = {
a:b
}
console.log('data', data.a);日志表示5，b的值。
在Vue和High曲线图中，我尝试使用相同的逻辑。在vue模板中设置高级图表，开始时将其选项设置为空，然后尝试将数字提供给序列。模板是<highcharts ref="chart" :callback="chartcallback" :options="options" ></highcharts>
然后使用Vue
B)将变量设置为空数组，将它们传递给选项，并使用这些变量更新vue中的选项
data(){
return{
series:[],
options: {
series: this.series,
}
}
}然后，在Vue，如果我知道
console.log(this.options.series);
this.series.push({
name:'hello',
data:[]
});
console.log(this.options.series);将options.series设置为var，更改var，options.series也会更改。第一个日志是undefined，第二个是空数组，但我只是在其中按下了名称和数据。这让我感到困惑，因为它就像A)，在javascript中这是可行的。在这里它没有。是因为Vue还是因为高图表？
我试过的另一种方法是
C) set选项为空，集合vars，与vars相等的选项
data(){
return{
options: {
series: [],
}
}
}然后，在Vue，如果我知道
console.log(this.options.series);
this.series.push({
name:'hello',
data:[]
});
this.options.series = this.series
console.log(this.options.series);这很管用，但我不明白为什么。第一个日志是一个空数组，第二个日志有名称和数据。如果设置选项，然后设置等于它的变量，为什么B)不能工作？我还为选项设置了var，但在不同的时间。
拜托，我想知道为什么B看起来像A不起作用。还有为什么C在创建选项之后工作，因为我将options.series设置为var
谢谢
回答 2
Stack Overflow用户
发布于 2020-03-18 01:52:02
我认为这是一个Javascript范围‘问题’，例如B)您运行console.log(this.options.series)并从选项中记录系列，但是您只调用方法push到this.series，您在不同的作用域上。
在C上，您有两个不同的作用域，但比运行this.options.series = this.series要好，这就是为什么它在那个时候工作的原因。
Stack Overflow用户
发布于 2020-03-18 12:41:53
在Vue和High曲线图中，我尝试使用相同的逻辑。
不完全是，我会尽量解释清楚。这样做：
data(){
return{
series:[],
options: {
series: this.series,
}
}
}它不像您所期望的那样工作，因为当引用this.series时，该数组实际上还没有在组件中定义。原因是Vue只在返回整个data对象之后才定义所有组件数据，因此不应该使用this引用data定义中的其他组件数据。
在第二种情况下：
data(){
return{
options: {
series: []
}
}
}console.log(this.options.series);
this.series.push({
name:'hello',
data:[]
});
this.options.series = this.series
console.log(this.options.series);第一个日志返回一个空数组，因为如您所见，它是在init上定义的。在此之后，您将新对象推入this.series数组(我怀疑它被定义为组件数据中的空数组)，然后将其赋值给options.series，这是完全正确的。
我希望这种描述能使你对这两种情况都有足够的了解。
https://stackoverflow.com/questions/60730798
复制相似问题
腾讯云开发者
