Question

我有一个导航菜单，其中列出了很多可以添加或删除工作表的工作表。因此，当我单击一个项目（工作表）时，我想基本上访问它，因此我想访问具有工作表ID的路线，以便进行更改。现在我的路线如下：

const routes = [
  
  { path: '/:id', name: 'singleSheet', component: singleSheet },
];

在我的 Sheets.vue 中，我得到了一个v-，用于列出我的工作表

  <v-card
          class="mx-auto pa-3 ma-2 text-center"
          max-width="400"
          v-for="todo in filteredTodos"
          :key="todo.id"
          @click="doSomething()"
        >
          <v-card-text>
            <router-link v-bind:to="'/'+todo.id">{{ todo.name }}</router-link>

            <v-btn icon color="red" class="ml-15" @click="deleteItem(todo.id)">
              <v-icon>mdi-delete</v-icon>
            </v-btn>
          </v-card-text>
        </v-card>

因此，如您所见，当我单击工作表的名称时，有一个指向 + todo.id 的路由器链接。

例如，我得到的是：http：// localhost：8080 / 5ynxSb1El4yPNuBZ4HpK

但是我的路线没有改变，所以我的意思是我的singleSheet.vue没有显示（这应该是因为在我的路线中将它们链接在一起（如您所见）

我应该怎么做才能访问每张纸？

谢谢。

Answer 1

是否为您的路由器分配了更多的路由，这些路由遵循相同的模式，且斜杠后只有一个参数，例如/home？如果是这样，vue-router不知道该怎么办，也不显示任何组件。

基于ID，Vue Firebase的动态路由问题

1 个答案: