Question

我正在运行一个PHP应用程序，我需要一些页面才能完全交换视图。我需要一个完全成熟的路由器，因为我需要利用历史模式API。

使用Vue路由器做这样的事情很容易：

const router = new VueRouter({
    routes: [
        { path: '/', component: DefaultView },
        { path: '/map', component: MapView }
    ]
});

在PHP中，我只是像这样加载路由器并将PHP生成的后端数据传递给两个视图：

<router-view data="<?= $data ?>"></router-view>

这适用于一个页面，但是如果我想让另一个页面具有完全不同的路由集呢？路由器需要知道它所在的页面，以便区分不同的路由集。

我要么需要检查支柱中传递的URL，就像我已经在使用我的数据一样。我不确定如何从路由器读取道具数据。

处理这个问题的好方法是什么？

Answer 1

你只需要两个名为location / { proxy_pass http://docker-backend; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Host $server_name; }

的名字

并将不同的数据传递给这些路由器视图。

router-views

或使用嵌套路线视图//儿童

<router-view class="view one"></router-view> //default
<router-view class="view two" name="a"></router-view>
<router-view class="view three" name="b"></router-view>

routes: [
    {
      path: '/',
      components: {
        default: Foo,
        a: Bar,
        b: Baz
      }
    },
    {
      path: '/map',
      components: {
        default: Foo2,
        a: Bar2,
        b: Baz2
      }
    }
  ]

多个带vue的路由器

1 个答案: