javascript - vue.js 中用于导航到动态路由的动态按钮
问题描述
我想通过单击按钮传递动态路由并获取单个用户信息,我正在使用 vuetify 所以我想知道如何在按钮中传递 userId 例如这是我的 URL:http://localhost:8080/users /userId 我可以从数据库中获取用户 ID,例如如果
userId = 3984EDeid9dnh3kd9i http://localhost:8080/users/3984EDeid9dnh3kd9i 但我不知道如何将其添加到按钮
这是我的代码:
<v-container fluid>
<v-row class="my-0">
<v-col
v-for="(user, userId) in users"
:key="userId"
class="col-lg-2 col-md-3 col-sm-4 col-xs-6"
>
<template>
<v-card hover :loading="loading" class="mx-auto" max-width="374">
<template slot="progress">
<v-progress-linear
color="deep-purple"
height="10"
indeterminate
></v-progress-linear>
</template>
<h4 text-right">
username :
<span class="font-weight-bold blue--text">
{{ user.userName}}
</span>
</h4>
<v-card-actions>
<v-col>
<v-btn
text
class="float-left"
style="text-decoration: none; color: inherit"
max-width="50px"
:to = HERE IS MY PROBLEM <===================
>More
</v-btn>
</v-col>
</v-card-actions>
</v-card>
</template>
</v-col>
</v-row>
</v-container>
<script>
export default {
data() {
return {
//after using axios and get userId
userId : this.getId
};
},
所以我可以在循环中显示所有用户的 userId 我只想知道如何使用 :to 传递动态路由并获取单个用户信息
解决方案
尝试将 id 连接到路径,如下所示:
:to ="'/users/'+user.id"
或者
:to ="`/users/${user.id}`"
推荐阅读
- mysql - 使用时间戳编写 SQL
- vue.js - 如何使字段独立?
- r - 使用 s2dverifications 包中的加载功能时,CDO 库不可用
- c++ - 您可以将一个宏作为参数提供给另一个宏,而不扩展初始宏吗?
- heroku - Heroku,无法访问 jarfile。再次
- android - 如何使用 Android 的 Layout 机制创建输入框?
- fiddlercore - 错误 - 未能将 Fiddler 注册为系统代理
- c# - .NET Core C# MVC DBContext 在类文件中为 Null
- boost - cmake v3.15.3 找不到 boost v1.71.0
- java - 编写 XWPF 文件的不同方法