工作内容
- fix ifish后台查看供应商电话显示错误
- 调试微信jssdk接入
- 汇车替换jssdk api来获取地理位置信息
handleViewUser(row) {
this.dialogUserInfoVisible = true;
if (row.role === 'VENDOR' || row.role === '供应商') {
axios.get(`${API.ifish_vendors}?userId=${row.id}`)
.then((res) => {
this.userInfo.company = res.data.company;
this.userInfo.companyAddress = res.data.companyAddress;
// 如果角色是vendor从vendor数据中拿电话
this.userInfo.mobile = res.data.mobile;
});
} else {
this.userInfo.mobile = row.mobile;
}
this.userInfo.email = row.email;
this.userInfo.role = this.formatRole(row); // 格式化角色名
},
把配置微信jssdk封装成通用函数，方便复用
// 微信jssdk配置函数
wxConfig(jsApiList, url, debug = false) {
axios.get(`${API.wechat_jssdk_config}?url=${url}`)
.then((res) => {
const data = res.data.data;
wx.config({
debug, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: data.appid, // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.nonceStr, // 必填，生成签名的随机串
signature: data.signature, // 必填，签名，见附录1
jsApiList // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});
});
}
将更新用户地理位置信息封装在action中
export const UPDATE_LOCATION = ({commit}) => {
wx.ready(() => {
wx.getLocation({
type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
success: (res) => {
const latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
const longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
commit(types.UPDATE_LOCATION, {latitude, longitude});
}
});
});
};
在全局路由钩子afterEach中调用微信jssdk配置方法防止路由改变后失效问题
router.afterEach((route) => {
commit(types.UPDATE_LOADING, false)
// 每次路由改变后配置微信jssdk防止失效
Helper.wxConfig(wxJsApiList, encodeURIComponent(window.location.href));
})
总结
- 不足
- 微信jssdk配置放在全局路由钩子函数中，无论页面有没有用到jssdk api，只要路由改变就配置，可能存在性能问题
