APP监听消息推送
1、监听消息推送,后端记得推送的模板是 : 透传消息!透传消息!透传消息!
2、我的需求是根据后端推送的数据,一旦有值就重新调用接口刷新页面数据。
3、我这边是监听消息推送即可,所以用不到监听的数据,用了watch监听,记得每次都要传时间戳或者其他的方式,每次传值必须不一样,不然watch监听不到数据变化,感觉能解决了问题的,动动小指头点个赞~ O(∩_∩)O
A、在App.vue中
onLaunch: function() {
let this_ =this
// #ifdef APP-PLUS
//监听接收透传消息事件
plus.push.addEventListener('receive', function(message) {
//处理透传消息的业务逻辑代码,message.content:监听到的数据
this_.$store.commit('changeValue',message.content)
}, false);
//#endif
console.log('APP onLaunch');
},
B、设置vuex,通过vuex传递数据,然后在调用的页面用watch监听数据的变化
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
let index = 0; // index的设置是为了每次更新数值不同,我的需求只需要监听到消息推送过来,调用接口即可。
const store = new Vuex.Store({
state: {
getData:'11', },
mutations: {
// 对state中的值,进行修改,这个参数state是data中所有的值哦。
changeValue(state, provider){
let a = index++;
this.state.getData= provider+a
}
}
})
export default store
C、页面调用
computed: {
memberData(){
return this.$store.state.getData;
},
},
watch: {
async memberData(){
await this.getUnReadData() //这是我监听数据变化调用接口更新页面数据
this.$refs.uToast.show({
title: '更新数据了',
// 如果不传此type参数,默认为default,也可以手动写上 type: 'default'
type: 'success',
position: 'top ',
// 如果不需要图标,请设置为false
icon: true
})
}
},
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。