search

Home  >  Q&A  >  body text

javascript - How to take parameters when going back in vue-router go(-1)?

//指定跳转到user页面,可带参数
router.go({name: 'user', params: {userId: 1}});

//不知道页面名,按历史记录跳转到上一页(这种情况应该怎么带参数???)
router.go(-1);
我想大声告诉你我想大声告诉你2749 days ago1720

reply all(4)I'll reply

  • 黄舟

    黄舟2017-05-19 10:31:50

    The problem has been solved! (It is not a rollback operation, so parameters cannot be taken. If necessary, refer to this method)

    Business needs

    • I am currently working on an Internet product for elderly care services. On multiple pages, you can enter the "Hospital List" page, select the hospital you want to serve, and then go back. For example, both "Home" and "Appointment" can enter the "Hospital" page.

    This means "hospital list page". You don't know or need to know which page the last page you visited was. You just need to select the hospital and return.
    Of course, you can also tell the hospital list page what the name of the previous page is by passing parameters, and then go back. But if there are too many pages, imagine how many judgment codes there will be on the hospital list page?



    Solution

    1. Declare an empty Vue moduleeventBus
    import Vue from 'vue'
    
    /**
     * 定义空的vue实例,作为 eventbus实现非父子组件之间的通信(vue2.x中去掉了broadcast)
     */
    var eventBus = new Vue({});
    export default eventBus;
    2. "Hospital List Page" passes eventBus.$emit to the previous page
    import eventBus from '../service/eventbus.js';
    
    methods:{
        //列表选中具体医院的点击事件
        goback(hospital){
            //传递一个map,choiceHospital是key,hospital是value
            eventBus.$emit('choiceHospital',hospital);
            //调用router回退页面
            this.$router.go(-1);
        }
    }
    3. "Home" and "Reservation" pages receive parameters
    import eventBus from '../service/eventbus.js';
    
    //每次激活时
    activated(){
        //根据key名获取传递回来的参数,data就是map
        eventBus.$on('choiceHospital', function(data){
            //赋值给首页的附近医院数据模型
            this.nearestOrg = data;
        }.bind(this));
    },

    Reference

    • How to communicate between vue non-parent-child components

    reply
    0
  • 给我你的怀抱

    给我你的怀抱2017-05-19 10:31:50

    This goes against the meaning of historical records. If it is accessed with parameters, it should be forward.

    In addition, SPA does not have the problem of data transmission. Why does backing off need to have parameters?

    reply
    0
  • 仅有的幸福

    仅有的幸福2017-05-19 10:31:50

    Official website grouter.go(-1) // Go back one step to record, which is equivalent to history.back(). It cannot take parameters.
    2 solutions: 1. Jump to the previous page by routing instead of returning 2. Data sharing can be achieved through store or vuex.

    reply
    0
  • 某草草

    某草草2017-05-19 10:31:50

    Don’t you use this.$router.back() to go back by yourself? Do you need to determine where it comes from?

    reply
    0
  • Cancelreply