1. Labels
<li v-for=" el in hotLins" >
<router-link :to="{path:‘details‘,query: {id:el.tog_line_id}}">
<img :src="el.image_list[0]">
<h3>{{el.tourism_name}} {{el.tog_line_id}}</h3>
<p>{{el.address}}</p>
</router-link>
</li>
2. In the component, when you need to pass dynamic parameters, you can use the above example
<router-link :to="{path:‘details‘,query: {id:el.tog_line_id}}">
3. The parameter id in the query is the parameter to be passed, and the method obtained in the component is:
created: function() {
var id = this.$route.query.id;
this.getData(id);
},
4. As above, this. root.id = id; passed to the parent component, passed in the parent component
// 根组件构造器
var vm = Vue.extend({
router: router,
data: function() {
return {
id: ‘11484‘ //城会玩明细id
}
}
})
5. Define the id in the data, and then pass the parameters in the subcomponent with props
props: {
id: {
type: String,
required: true
}
},
6. In router-view, pass this parameter:
<router-view :id="id" :order-info="orderInfo">
</router-view>
When paying attention to orderInfo, here is: order-info