页面跳转后进行操作之后回退实现无感刷新

项目场景：

订单列表进入订单详情页面之后在订单详情页面操作取消订单，回退到订单列表页面实现无感刷新

---

问题描述：

订单列表进入订单详情页面之后在订单详情页面操作取消订单，回退到订单列表页面，这里直接刷新页面的话，第一页的数据还好，但是如果操作的这笔订单在第2或者第20页，刷新页面的话重新获取数据的话就会回到第一页，而且手机端订单一般都是没有搜索功能的，操作之后就再去找这笔订单就很麻烦

订单列表页面

订单详情页面

解决方案：

订单列表页面

//订单列表中data定义一个变量
 data() {
    return {
      // 订单详情返回列表实现无感刷新相关参数
      operation: '',
      clickItemIndex: null, //点击跳转到订单详情的列表下标
      orderList:[] // 订单列表数据源
    }
  },
onShow() {
	//在onShow中就可以直接获取到在订单详情中改到的this.operation的值了
	console.log(this.operation, 'this.operation')
	// 再点点击每一个订单跳转到订单详情的时候记录下点击的订单下标this.clickItemIndex，
	// 订单详情中操作取消订单回退到本页面时候，
	// 通过this.$set()直接修改改订单的状态即可 90为已取消 , 
	// 这里只针对全部订单需要修改状态，如果在待支付的tab下取消订单则要this.orderList.splice(this.clickItemIndex, 1)删除该条订单
	 this.$set(this.orderList[this.clickItemIndex], 'orderStatus', 90)
}

---

订单详情页面

var pages = getCurrentPages()
var currPage = pages[pages.length - 2]
可以通过上面两行代码取到订单列表data中定义的数据

<!--
 * 功能：订单详情页面
 * 作者： fyq
 * 日期:  2021-08-28
 -->
<template>
        <view class="btn" @click="closeOrder">取消订单</view>
</template>

<script>
export default {
  data() {
    return {}
  },
  onLoad(options) {},
  onShow() {},
  methods: {
    // 点击确认收货按钮
    closeOrder() {
        var pages = getCurrentPages()
        var currPage = pages[pages.length - 2]
         // 修改订单列表中operation的值
        currPage.$vm.operation = 'confirm'
    },
  },
}
</script>

<style lang="scss">

</style>