How can vue router-link jump from this page to the different parameters passed only on this page?

A personal information center similar to qq, the following is a visitor record, click on the visitor record to jump to the visitor"s personal information center, the page is still this page, only? After the id is not the same, how to achieve ah?

<router-link v-for="(hd,index) in hdinfo"
                       :key="index"
                       :to="{path:"/friendinfo",query:{id:hd.uid}}"
                       tag="li">
            <span>{{hd.lookname}}</span>
            <i></i>

            <em>{{hd.looktime}} ></em>

          </router-link>

the current page is: / index/id_card.html-sharp/friendinfo?id=1021
I want to jump from the current page to: / index/id_card.html-sharp/friendinfo?id=1020

Vue-router page-jumps-to

Mar.28,2021

use @ click to click on the event without router-link, bring hd.uid to
and then
this.$router.push ({name: 'pathname', params: {id: id}})

in js.


              <span>{{hd.lookname}}</span>
              <i></i>
              <em>{{hd.looktime}} ></em>
            </li>


     // 
        hdhref(uid) {
          this.$router.push({
            path: `/friendinfo/${uid}`
          });
        },

//
watch: {
    "$route": {
      handler(val) {
        // console.log(val)
        let str = val.params.id
        this.sid = str.split('_')[0];
        // console.log(this.sid,'sid')
        this.applyid = str.split('_')[1];
        // console.log(this.applyid,'applyid')
        this.gethimInfo();
      },
      immediate: true
    }
  },

Previous: How to use python to form nested json data?

Next: There is an inexplicable error in the project created by vue-cli. Just delete the node_modules and download it again.