首頁diy商品選項卡組件緩存優(yōu)化

管理

編輯

刪除

浮云先生 PRO版 v 3.0.2 2024-07-22 12:05:22

其他

//原代碼 -每次切換選項 都會重新從服務(wù)器獲取數(shù)據(jù)
pages/index/components/goodList.vue

productslist() {
				let limit = this.$config.LIMIT;
				let data = {};
				if (this.typeConfig == 1) {
					data = {
						ids: this.dataConfig.goodsList.ids.join(','),
					};
				} else {
					data = {
						priceOrder: this.goodsSort == 2 ? 'desc' : '',
						salesOrder: this.goodsSort == 1 ? 'desc' : '',
						brand_id: this.typeConfig == 2 ? this.dataConfig.brandList.brandVal.join(',') : '',
						store_label_id: this.typeConfig == 4 ? this.dataConfig.goodsLabel.activeValue.join(',') : '',
						cate_id: this.typeConfig == 3 ? this.dataConfig.classList.classVal.join(',') : '',
						limit: this.numberConfig
					};
				}
				getProductslist(data).then(res => {
					this.tempArr = res.data;
				});
			},
			
			


			
//優(yōu)化修改后，初次點擊切換從服務(wù)器獲取，后續(xù)切換從本地緩存， 總共改3個地方

//前兩處修改 文件路徑
//pages/index/components/promotionList.vue

watch: {
			activeValue: {
				handler(value) {
					let that = this;
					let type = that.goodType == 0 ? 3 : that.goodType;
					let goodDataConfig = {

						navindex:this.ProductNavindex,//新增已選分類index
						......
						
						
created() {
			let that = this;
			let type = that.goodType == 0 ? 3 : that.goodType;
			let goodDataConfig = {
				navindex:this.ProductNavindex,//新增已選分類index						

......



//最后一處修改 文件路徑
//pages/index/components/goodList.vue

				productslist() {
				let limit = this.$config.LIMIT;
				let data = {};
				if (this.typeConfig == 1) {
					data = {
						ids: this.dataConfig.goodsList.ids.join(','),
					};
				} else {
					data = {
						priceOrder: this.goodsSort == 2 ? 'desc' : '',
						salesOrder: this.goodsSort == 1 ? 'desc' : '',
						brand_id: this.typeConfig == 2 ? this.dataConfig.brandList.brandVal.join(',') : '',
						store_label_id: this.typeConfig == 4 ? this.dataConfig.goodsLabel.activeValue.join(',') : '',
						cate_id: this.typeConfig == 3 ? this.dataConfig.classList.classVal.join(',') : '',
						limit: this.numberConfig
					};
				}


				let diyVersion = uni.getStorageSync('diyVersion') //首頁diy版本
				let navindex = this.dataConfig.navindex
				let key = navindex !== null ? `navinde&${navindex}` : null;
				if (key) {
					let goods = uni.getStorageSync(key) //根據(jù)key獲取指定商品列表 和 緩存版本
					if (goods.version == diyVersion) { //檢查緩存是否過期
						this.tempArr = goods.list //未過期 直接使用緩存
						return
					}
				}
				getProductslist(data).then(res => {
					this.tempArr = res.data

					//存入緩存
					if (key) {
						let value = {
							list: res.data,
							version: diyVersion
						};
						uni.setStorageSync(key, value);
						console.log("存入緩存", key, value)
					}
				});

			},