Vue2.0 this page jumps to this page and refreshes the data

wrote a news Demo article page with a list of recommendations. How to click on the list to refresh the page data

I sent the article data on this page through the home page params

<div class="content">
      <div class="top">
        <h2>{{ this.title }}</h2>
        <span>{{ this.team }}</span>
        <em>{{ this.time }}</em>
      </div>
      <div class="product">
        <img :src="this.img" alt>
        <div class="details" v-html=" this.content"></div>
        <div class="recommend">
          <em></em>
          <span></span>
          <em></em>
        </div>
      </div>

      <div class="bt" >
        <li v-for="(lists, conts) in $store.state.listNews" :key="conts">
          <div class="inner" @click="nextProduct(conts)">//
            <div class="wrap_l">
              

{{ lists.title }}

<div class="boot"> <span>{{ lists.src }}</span> </div> </div> <div class="wrap_r"> <img v-lazy="lists.pic" :key="lists.pic"> </div> </div> </li> </div> </div> </div>

wrote a click method

    nextProduct(conts){
      this.$router.push({path:"/words", query:{conts}})
    }

the click method above. I don"t know how to pass the parameters title and pic to the method.

now the click address is changed.

May.05,2022

  

do not jump, the $emit event goes out, and the parent component reorganizes the data after you send it, changing the data

Menu