第一种:通过组件去调用页面里面的方法
执行过程:已mine.wxml页面和minelogot.wxml页面为例
1、在mine.json中引入该组件:
{
"usingComponents": {
"minelogot":"/components/minelogot/minelogot"
},
"navigationBarTitleText": "我的"
}
2、在mine.wxml中使用minelogot组件:
<view>
<minelogot id="minelogot" logot="{{flaglogot}}" bind:canclemine="canclemine"></minelogot>
</view>
3、在minelogot.js里面接收传递过来的参数,定义方法
Component({
/**
* 组件的属性列表
*/
properties: {
logot:{
type:Boolean,
value:false
}
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
evaluCancle() {
this.triggerEvent('canclemine',{logot: false})
},
goOut(){
wx.reLaunch({
url: '../login/login',
})
},
}
})
4、在组件minelogot.wxml中定一个方法evaluCancle:
<view class="popEvalu" wx:if="{{logot}}">
<view class="popEvaluContent">
<view class="evaluBtn">
<view class="evaluMain">
<!-- <view class="evalurow">拍照</view> -->
<view class="evalurow" bindtap="goOut">退出登录</view>
</view>
<view class="evaluBtn-btn bb2" bindtap="evaluCancle">取消</view>
</view>
</view>
</view>
5、触发方法以后通过this.triggerEvent()向mine页面传递方法
6、mine页面接收参数,触发方法:
canclemine(e){
console.log(e.detail.logot)
},
第二种:通过页面调用组件里面的方法
通过mine页面,调用minelogot组件:
1.在mine页面中使用minelogot组件,给他起一个ID
2.在mine.js中,获取到这个组件(实例化)
3.通过实例化的对象,即可调用组件中的方法
mine.js逻辑
onReady: function(options) {
this.minelogot = this.selectComponent("#minelogot"); //这里是实例化了minelogot,通过minelogot,我们就能调用minelogot组建中的方法
},
useComponentFn(){
this.minelogot.componentFn();//调用了组建中的componentFn方法
}