微信小程序--自定义tabbar切换页面时，保留数据方案

自定义的tabbar组件，每次切换页面时都会重新加载页面和数据，需要通过一些方法把tabbar菜单的数据保留下来，不要每次都请求数据。

方案一：在app.js文件里定义全局数据（本次项目采用的是可以在后台管理里配置的数据，所以采用了方案一）

1、在app.js文件里定义一个全局变量

App({   globalData: { 　　tabbarlist:{} 　} }) 2、在tabbar组件的js文件获取app.js保留的数据 const app = getApp(); Component({ ready() {    //将保留数据赋值给tabbar的list     this.setData({       list:app.globalData.decorateTabbar     }) 　　如果是第一次加载，保留的数据是空的，则需要请求接口获取数据     if (!isEmpty(app.globalData.decorateTabbar)) this.getDecorateData();   }, methods: { getDecorateData() {       getshopDecorate().then(({ data }) => { 　　//处理数据         let arr = data.find((element) => {           return element.isShow && element.type == "tabbar";         });         arr.ext = JSON.parse(arr.ext);         let arr2 = arr.ext.filter((ele) => {           if (ele.isShow) return ele;         }); 　　给当前页面的list和保留的数据赋值
        if (!isEmpty(app.globalData.decorateTabbar)) {           this.setData({             list: { isShow: arr.isShow, ext: arr2 },           });         }         app.globalData.decorateTabbar = { isShow: arr.isShow, ext: arr2 };       });     }, } )}  

wx.setStorageSync('someData', 'Hello World');//在获取到数据时存储到缓存里 var someData = wx.getStorageSync('someData'); console.log(someData); // 输出：Hello World   //切换再进入页面时，从缓存种读取数据  

当 TabBar 切换页面时，通过自定义事件或消息订阅机制，将数据传递给目标页面。

1、在目标页面中监听事件或订阅消息，并在相应的回调函数中处理数据：

Page({ onl oad: function() { var that = this; wx.onAppShow(function(data) { console.log(data); // 输出：Hello World that.setData({ someData: data }); }); } });
2、在切换页面时，触发相应的事件或发布消息，并将数据传递给目标页面：

wx.onTabItemTap(function(item) { wx.triggerEvent('onAppShow', 'Hello World'); })