微信小程序如何在公共组件中改变某一个页面的属性值

需求

公共组件A改变页面B的属性isShow的值。

思路

首先目前我不了解可以直接在组件中改变页面的值的方法，所以我通过监听的方式在B页面监听app.js的某一属性值的改变从而改变B页面的值，众所周知app.js的某一属性值是很容易就能更改的。

app.js

  globalData: {isShow: false},//给app.js中被监听的值赋初始值// 使用数据劫持模式监听数据变化observe(obj, key, watch, that) {let val = obj[key];Object.defineProperty(obj, key, {configurable: true,enumerable: true,set: function (value) {watch(val, value, that);val = value;},get: function () {return val;}})}

B页面

  data:{isShow:false},//在onReady中调用app.js的observe,并且传参，第二个参数为要监听的app.js的属性值onReady() {const app = getApp()app.observe(app.globalData, "isShow", this.watch, this);},watch(oldVal, newVal, that) {that.setData({isShow: newVal//监听后得到新的值，并将新的值赋值给页面的这个我们要改变的这个属性})}

A组件

组件中只需要在你需要改变页面值的时候改变一下app.js的所被监听的这个属性的值即可。

getApp().globalData.isShow = true