Question

我通过使用vue＆vuetify使用模拟数据创建了一个网站模板。我有不同的页面，例如：

localhost：8080 / home
localhost：8080 / exp
本地主机：8080 /技能
localhost：8080 / about

我想为每个用户使用此模板，并将结构更改为：

localhost：8080 / 用户名 / home
localhost：8080 / 用户名 / exp
localhost：8080 / 用户名 /技能
localhost：8080 / 用户名 / home

我不知道这是否是最佳实践，也不知道该怎么做。请你帮助我好吗？先谢谢了。

侧面说明：：我认为我将使用Firebase来存储和获取与用户相关的数据。我也欢迎任何建议。

编辑：当我进入 localhost：8080 / user / 1 时，我可以在User.vue中看到所有内容，但是当我进入 localhost：8080 / user / 1 /家什么也没有呈现。（ localhost：8080 / home 起作用。我也可以在User.vue和Home.vue中看到所有内容。

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/user/:id',
      component: User,
      children: [
        {
          path: '/home',
          name: 'home',
          component: Home
        },
        {
          path: '/exp',
          name: 'exp',
          component: Exp
        },
        {
          path: '/skills',
          name: 'skills',
          component: Skills
        },
        {
          path: '/about',
          name: 'about',
          component: About
        }
      ]
    }
  ]
})

User.Vue

<template>
    <div>
        user
        <div>This is Bar {{ $route.params.id }}</div>
        {{personal.name}}
        <router-link :to="{ name: 'personal' }">Personal Info</router-link>
        <router-view></router-view>
    </div>
</template>

Answer 1

您需要在路由器中执行此操作。像这样：

{
  path: 'username',
  meta: { label: 'Username'},
  component: {
    render (c) { return c('router-view') }
  },
  children: [
    {
      path: 'home',
      name: 'Home',
      component: Home
    },
    {
      path: 'exp',
      name: 'Exp',
      component: Cards
    },
    {
      path: 'about',
      name: 'About',
      component: About
    },
    {
      path: 'other',
      name: 'Other',
      component: Other
    }
  ]
}

因此，您将childs添加到您的路径中。这使该网址看起来像/ username / exp

Answer 2

主要问题是在路径中使用“ / 家”。这就是为什么它使用 localhost：8080 / home 而不是 localhost：8080 / user / 1 / home

# if you are using a generator
def my_generator(...):

    # prep the data ...

    yield [batch_tr_numerical, batch_tr_cat1, batch_tr_cat2, batch_tr_cat3], batch_tr_y

    # or use the names
    yield {'numeric_input': batch_tr_numerical,
           'cat1_input': batch_tr_cat1,
           'cat2_input': batch_tr_cat2,
           'cat3_input': batch_tr_cat3}, batch_tr_y

model.fit_generator(my_generator(...), ...)

# or if you are subclassing Sequence class
class MySequnece(Sequence):
    def __init__(self, x_set, y_set, batch_size):
        # initialize the data

    def __getitem__(self, idx):
        # fetch data for the given batch index (i.e. idx)

        # same as the generator above but use `return` instead of `yield`

model.fit_generator(MySequence(...), ...)

User.Vue

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/user/:id',
      component: User,
      children: [
        {
          path: 'home',
          name: 'home',
          component: Home
        },
        {
          path: 'exp',
          name: 'exp',
          component: Exp
        },
        {
          path: 'skills',
          name: 'skills',
          component: Skills
        },
        {
          path: 'about',
          name: 'about',
          component: About
        }
      ]
    }
  ]
})

Vue路线URL：用户名/页面名称

2 个答案: