Vue jsのmethodsプロパティで関数を呼び出すことにより、dataプロパティで宣言された配列を埋めようとしています。コードは次のとおりです。
<script>
export default {
extends: Bar,
mounted() {
this.renderChart(this.chartData, this.options);
this.fillLabel();
},
data() {
return {
chartData: {
labels:[],
datasets: [
{
label: "Users",
data: [40,20,12,39,10,40]
}
]
},
};
},
methods: {
fillLabel() {
this.chartData.datasets[0].data.map(function (key,value) {
this.chartData.labels.push(key);
})
}
}
};
</script>
しかし、これは私にコンソールで次のエラーを与えます：
[Vue警告]：マウントされたフックのエラー：「TypeError：未定義のプロパティ 'chartData'を読み取れません」
では、ラベル配列（chatData内）をデータ配列（データセット内）の長さまで0で埋めるにはどうすればよいですか？
私はあなたの助けを探しています。前もって感謝します。
これは、map関数内の関数がthisコンテキストを失うという事実によるものです。そのため、未定義になります。
この問題を解決するには、マップ内で矢印関数を使用します。
this.chartData.datasets [0] .data.map（（key、value）=> {this.chartData.labels.push（key）;}）
これは問題を解決します
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加