解决vue-router中的query动态传参问题
最近在写项⽬，在写项⽬的过程会总发现这样或者那样的问题，⽐如说vue-router中的query如何传递动态的参数，经过了⼀些波折才解决了问题，问题描述如下：
<li><router-link :to="{path:'editmovie', query: {id : 111}}" class="edit">修改</router-link></li>
实际上我需要的id是放在⼀个隐藏的元素中的：
<li class="hiden">2016987</li>
刚开始我的想法就是，想调⽤组件中的methods中的⽅法，但是尝试了⼏次，都失败了，之后偶然看到⼀个问答
vue-router动态配置传⼊参数问题，然后我⼜看到下⾯的代码：
<li v-for=" el in hotLins" >
<router-link :to="{path:‘details‘,query: {_line_id}}">
<img :src="el.image_list[0]">
<h3>{{el.tourism_name}} {{el.tog_line_id}}</h3>
antdesignvue 配置外部文件
<p>{{el.address}}</p>
</router-link>
</li>
⼀下⼦感觉有了思路，解决办法如下：
给li的id绑定了data中的id，然后query中写⼊绑定的这个就可以了
<li v-bind:id="id"><router-link :to="{path:'editmovie', query: {id : id}}" class="edit">修改</router-link></li>
export default {
name : 'Movie',
data() {
return {
id : ""
}
},
methods: {
getId () {
var id = $('.hiden').eq(0).text();
console.log(id);
}
},
mounted() {
this.id = $('.hiden').eq(0).text();
},
components : {
Heade,
Foot
}
}
以上这篇解决vue-router中的query动态传参问题就是⼩编分享给⼤家的全部内容了，希望能给⼤家⼀个参考，也希望⼤家多多⽀持。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。