比如我实现一个新增用户地址的按钮,但新增用户地址只是这个按钮组件的方法之一,我想在组件的wxml标签上直接填这个组件内部新增用户地址的方法,不想再扯到页面逻辑层里,能实现吗?
下面是一个设想例子,让组件接受来自page的函数名以决定调用哪个方法,要是eval没被禁我也就不用问这题了.
xxpage.wxml
<img-btn-comp bindCompMethod="addressInfo" >
<view class='redirect-address' slot="address">
<text class='redirect-text'>新增收货地址</text>
<icon class='iconfont icon-webicon213'></icon>
</view>
</img-btn-comp>
component/img-button
// components/image-button/index.js
Component({
/**
* 组件的属性列表
*/
options: {
multipleSlots: true
},
properties: {
openType: {
type: String
},
imageSrc: {
type: String
},
bindCompMethod: {
type: String
},
bindGetUserProfile: {
type: String
}
},
/**
* 组件的初始数据
*/
data: {
addressInfo: ""
},
/**
* 组件的方法列表
*/
methods: {
methodRoute() {
console.log(this.data.bindCompMethod);
},
onGetUserProfile(event) {
console.log(this.data);
console.log(event.detail);
if (this.data.openType == "getuserprofile") {
this.triggerEvent('getUserProfile', event.detail, {})
}
},
address(event) {
console.log(event.detail);
if (this.data.openType == "primary") {
this.addressInfo(event);
}
},
addressInfo(e) {
wx.chooseAddress({
success: res => {
console.log(res);
this.setData({
addressInfo: res
})
},
fail: (err) => {},
complete: e => {
if (e.errMsg == "chooseAddress:ok") {
this.triggerEvent('addressInfo', {
addressInfo: this.data.addressInfo,
status: "ok"
}, {})
} else {
this.triggerEvent('addressInfo', {
status: "error"
}, {})
}
}
})
}
}
})