正文

vue-router 动态导航 router-link :to属性

IP云
IP云V管理员/2 阅读
12/02
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

经常碰到这类需求，从后台获取数据后再前程连接，参数id动态获取 

            <el-row v-for="item in Travels">

              <el-col :span="24">

                <el-card :body-style="{ padding: '0px' , width : '100%'}">

                  <router-link :to="{path:'/travel/detail/'+ item.id}"><img :src="item.img" class="image"></router-link>

                  <div style="padding: 14px;">

                    <span class="description">{{item.description}}</span>

                    <div class="bottom clearfix">

                      <time class="time">{{item.time}}</time>

                    </div>

                  </div>

                </el-card>

              </el-col>

            </el-row>

        </div>
:to="{path:'/travel/detail/'+ item.id}" 利用：to 属性可以动态分配


        mounted(){

            this.GetTravel(this.$route.params.days);

        }

使用 

this.$route.params.days 可以获取当前路由参数
{{$route.params.id}} 可以在模板中获取当前路由参数
 

相关阅读

目录[+]