发布时间:2023-09-14 19:00
1. 在接口函数中定义(api/index.js):(切记一定是没有{},否则就参数错误啦)
// export const reqShopList=({geohash,keyword})=>ajax(base_url+'/search_shops',{geohash, keyword})
export const reqShopList=(geohash,keyword)=>ajax(base_url+'/search_shops',{geohash, keyword})
2.在mutation-type里定义:
export const RECEIVE_SEARCH_SHOPS='receive_search_shops'//接收搜索的商家数组
3. 在mutation里:
[RECEIVE_SEARCH_SHOPS](state, {
searchshops
}) {
state.searchshops = searchshops;
},
4. 在action里:(接收参数)
async searchShopGoods({
commit
,state},keyword) {
const geohash = state.latitude + ',' + state.longitude;
const result = await reqShopList(geohash,keyword)
if (result.code === 0) {
const searchShops = result.data
commit(RECEIVE_SEARCH_SHOPS, {
searchShops
})
// 如果组件中传递了接收消息的回调函数, 数据更新后, 调用回调通知调用的组件
// callback && callback()
}
},
5. 在需要信息的vue文件里:
search(){
//得到搜索关键字
const keyword=this.keyword.trim();
//进行搜索
if(keyword){
this.$store.dispatch('searchShopGoods',keyword)
}
}
6. 显示数据