页面弹框中内容点击跳转,返回希望弹框操作依然在

首先我们的思路是,给每个弹框组件加上一个唯一标识用props去接收,然后再要跳转的时候,把他给带到下个页面,下个页面点击返回的时候,把这个标识给带回来,(页面的弹框内容跳转肯定是需要id的,我们在返回这里还需要携带上个页面点击的id,这个id我的项目是可以直接从vuex里面拿到的,这时候我直接把它也一起返回回去),然后点击返回的时候给到刚刚页面的一个id和一个我们保存的唯一标识,最后在返回的页面中判断this.$route.params是否不为{},如果不为空就直接调用你的弹框方法,并携带那个id就可以了,下面看我的代码。

  <teacher-construction-table
      title="各班任教情况总览"
      :permis="['jtClassTeaching:export']"
      :customStyle="{ width: '40%', left: '45%', top: '24px' }"
      :bordered="false"
      :isExport="true"
      v-model:show="previewShow2"
      :dataSource="teachData"
      :columns="teachColumns"
      :rowKey="(row) => row.NJMC + row.BJMC"
      uniqueId="groupBiShop"
    />

首先我们在弹框组建中添加唯一标识,uniqueId

  props: [
    'title',
    'permis',
    'customStyle',
    'show',
    'bordered',
    'columns',
    'dataSource',
    'scroll',
    'isExport',
    'isFilter',
    'uniqueId',
  ],

在子页面用props接收

    this.$router.push({ name: toname, params: this.uniqueId ? { uniqueId: this.uniqueId } : {} })

再要跳转的地方添加标识

 最后我们在返回按钮的地方添加如下操作,params是我们要携带的参数

    let { uniqueId, schoolId } = this.$route.params
    console.log(this.$route.params)
    if (uniqueId) {
      if (uniqueId === 'groupBiShop') {
        this.onschoolclick({ ID: schoolId }, this)
        this.showTeachInfo()
      }
      if (uniqueId === 'groupConstruction') {
        this.showPreviewDialog()
      }
      if (uniqueId === 'groupSchoolCadre') {
        this.showAdministrativeDialog()
      }
    }

最后我们直接在created中调用即可,跳过去就有值,没跳过去的话就不进行操作,总体思路就这样。。。。

效果因为是企业项目不便观看,总之思路是没问题的,代码是没问题的,亲测

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值