英文:
Why the fetching data Get request isn't returning several parameters, instead it returns a single one Vuex?
问题
I'm expecting to get data and visualize a list with a fetch GET request, by passing two parameters. So I'm getting an error 400 when I pass two parameters, and I'm getting data ok when I'm passing a single one.
这段文字是关于使用GET请求获取数据并通过传递两个参数来可视化列表的。当传递两个参数时,我遇到了400错误,但当只传递一个参数时,数据正常。
This doesn't work
这部分不起作用
This works
这部分起作用
This works
这部分起作用
英文:
I'm expecting to get data and visualize a list with a fetch GET request, by passing two parameters. So I'm getting an error 400 when I pass two parameters, and I'm getting data ok when I'm passing a single one.
This doesn't work
async getFlights(context, { selectedPoint, departurePoint }) {
const res = await fetch(
`http://api.travelpayouts.com/v2/prices/month-matrix?currency=rub&origin=${selectedPoint}&destination=${departurePoint}&show_to_affiliates&token=${context.state.token}`,
);
if (res.ok) {
let result = await res.json();
context.commit('setFlights', result.data);
}
return res.ok;
},
This works
async getFlights(context, selectedPoint }) {
const res = await fetch(
`http://api.travelpayouts.com/v2/prices/month-matrix?currency=rub&origin=${selectedPoint}&destination=LED&show_to_affiliates&token=${context.state.token}`,
);
if (res.ok) {
let result = await res.json();
context.commit('setFlights', result.data);
}
return res.ok;
},
This works
async getFlights(context, departurePoint }) {
const res = await fetch(
`http://api.travelpayouts.com/v2/prices/month-matrix?currency=rub&origin=LED&destination=${departurePoint}&show_to_affiliates&token=${context.state.token}`,
);
if (res.ok) {
let result = await res.json();
context.commit('setFlights', result.data);
}
return res.ok;
},
答案1
得分: 0
可以使用 Vuex 并为所选内容创建附加状态,例如:
state: {
selectedArival: null,
selectedDeparture: null,
...
},
然后为它们创建 mutations:
setSelectedArival(state, data) {
state.selectedArival = data;
},
setSelectedDeparture(state, data) {
state.selectedDeparture = data;
},
在选择时进行提交:
choosePoint(point) {
...
this.$store.commit('setSelectedDeparture', this.selectedPoint);
// this.$store.commit('setSelectedArival', this.selectedPoint); from other component
...
// 在调度 getFlights 之前
}
并更改 action 为:
async getFlights(context) {
const res = await fetch(
`https://api.travelpayouts.com/v2/prices/month-matrix?currency=rub&origin=${context.state.selectedDeparture}&destination=${context.state.selectedArival}&show_to_affiliates=true&token=${context.state.token}`
);
...
}
英文:
You can use vuex and create additional states for selected stuff, for example:
state: {
selectedArival: null,
selectedDeparture: null,
...
},
then mutations for them:
setSelectedArival(state, data) {
state.selectedArival = data;
},
setSelectedDeparture(state, data) {
state.selectedDeparture = data;
},
commit them on selection:
choosePoint(point) {
...
this.$store.commit('setSelectedDeparture', this.selectedPoint);
// this.$store.commit('setSelectedArival', this.selectedPoint); from other component
...
// before dispatching getFlights
}
and change action to:
async getFlights(context) {
const res = await fetch(
`https://api.travelpayouts.com/v2/prices/month-matrix?currency=rub&origin=${context.state.selectedDeparture}&destination=${context.state.selectedArival}&show_to_affiliates=true&token=${context.state.token}`
);
...
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论