javascript - 无法在 Vue.js 中将数据从模型传递到方法
问题描述
我有一个带有年份的简单下拉列表的图表,只要用户修改它,我就需要传递年份,以便图表显示当年的数据。
例如,当我尝试从此方法访问参数时,我得到的只是未定义的:
fetchBarChartData({ anio, sort }) {
var self = this;
console.log(anio);
fetch("https://demo8358110.mockable.io/year/" + this.anio) // insert your api call here
.then(function(response) {
var r = response.json();
return r;
})
.then(function(data) {
self.values = data.values;
self.valuesline = data.valuesline;
self.loaded = true;
});
https://demo8358110.mockable.io/year/undefined
编辑:我添加了一个示例https://codesandbox.io/s/vue-template-x4z7b
解决方案
您需要将更改后的年份传递给 fetchBarChartData 函数:
<select name="year" v-model="year" @change="fetchBarChartData(year)">
推荐阅读
- python - 将所有空格保留为标记
- c++ - 与链接静态库相比,为什么从源代码构建时 gcc 会产生不同的结果?
- arduino - 绝对函数未提供所需值
- python - Microsoft Azure:使用 azure API for Python 在 Linux 上获取公共 IP
- sql-server - 平均、总计和转置
- python - 使用制表符在 Python 中打印表格时列对齐不正确
- sql - 十六进制值如何与where子句选择表进行内部连接?
- node.js - jenkins 权限被拒绝节点
- angular - 3秒后无法调用功能Angular 4
- mongodb - clusterSettings 不是 com.mongodb.MongoClientSettings.Builder 的成员