作用

多个页面需要一个功能时，用mixins进行复用，使代码更简洁

流程

1 新建一个 mixin 文件 mixins/loginConfirm.js

export default {methods: {// 是否需要弹登录确认框// (1) 需要，返回 true，并直接弹出登录确认框// (2) 不需要，返回 falseloginConfirm () {if (!this.$store.getters.token) {this.$dialog.confirm({title: '温馨提示',message: '此时需要先登录才能继续操作哦',confirmButtonText: '去登陆',cancelButtonText: '再逛逛'}).then(() => {// 如果希望，跳转到登录 => 登录后能回跳回来，需要在跳转去携带参数 (当前的路径地址)// this.$route.fullPath (会包含查询参数)this.$router.replace({path: '/login',query: {backUrl: this.$route.fullPath}//route.fullPath 包含从基本URL后开始的路径，假设基本URL（base URL）为 /app，并且当前路由为 /app/home?a=1，那么route.path的值将是 /home?a=1；})}).catch(() => {})return true}return false}}
}

2 页面中导入，混入方法

import loginConfirm from '@/mixins/loginConfirm'export default {name: 'ProDetail',mixins: [loginConfirm],...
}

3 页面中调用 混入的方法

async addCart () {if (this.loginConfirm()) {return}const { data } = await addCart(this.goodsId, this.addCount, this.detail.skuList[0].goods_sku_id)this.cartTotal = data.cartTotalthis.$toast('加入购物车成功')this.showPannel = falseconsole.log(this.cartTotal)
},goBuyNow () {if (this.loginConfirm()) {return}this.$router.push({path: '/pay',query: {mode: 'buyNow',goodsId: this.goodsId,goodsSkuId: this.detail.skuList[0].goods_sku_id,goodsNum: this.addCount}})
}