背景:除了vue 中实际应用这个方法,我们还可以再哪些场景中使用呢?
我们在定义SDK的时候,基于sdk可以对自己封装的方法进行一些拦截操作,或者对三方的功能进行一些操作,这样能够得到一些准确的数据
基于拦截操作,有一定的风险,如果我们拦截时代码出现异常,导致sdk api发生错误将会导致api调用失败
/**
* 支付拦截
*/
const cus = {}
cus.pay = function({
mount,
key,
success,
fail
}) {
// 。。。逻辑处理
if (key === 12345 ) {
success({
code: 0,
msg: '支付成功'
})
} else {
fail({
code: 304,
msg: '支付失败'
})
}
}
// -------
function interceptPay() {
const originPay = cus.pay
Object.defineProperty(cus, 'pay', {
writable: true,
enumerable: true,
writable: true,
value: function() {
const config = arguments[0] || {}
console.log('开始支付>>>>')
if (config.success) {
const success = config.success
config.success = function(res) {
console.log('支付成功>>>>')
success(res)
}
}
if (config.fail) {
const fail = config.fail
config.fail = function(res) {
console.log('支付失败>>>>')
fail(err)
}
}
return originPay.apply(this, arguments)
}
})
}
interceptPay()
cus.pay({
amount: 100,
key: 12345,
success: (res) => {
console.log(res)
console.log('拿到响应后的操作>>>>')
},
fail: (err) => {
console.log(err)
console.log('失败后的操作>>>>')
}
})