php - 如何使 vue-routes 工作

Question

我正在尝试使用教程设置路线。我有这个代码，但任何数据都没有导入到所选页面（/home）。知道如何解决吗？这是我的代码：

应用程序.js

import VueRouter from 'vue-router';
import router from "./router";
import App from "./components/App";
import Test from "./components/test";
window.Vue = require('vue');
Vue.use(VueRouter);
const app = new Vue({
    el: '#app',
    render : h => h(App),
    router
});
@endsection

粘贴箱： https ://pastebin.com/7yMREHxR

https://codesandbox.io/s/hungry-browser-hsi6d

标签： phplaravelvue.js

Answer 1

改变

import Vue from "vue";
import VueRouter from "vue-router";
import Test from "./components/Test";

Vue.use(VueRouter);

export default new VueRouter({
  routes: [
    {
      path: "/home",
      component: Test
    }
  ]
});

至

import Vue from "vue";
import VueRouter from "vue-router";
import Test from "./components/Test";

Vue.use(VueRouter);

export default new VueRouter({
  routes: [
    {
      path: "/",
      component: Test
    }
  ]
});

这里的关键是路径属性。您将其设置为“/home”。因此，您的应用程序有效，但只有当您通过将其更改为“/”导航到“localhost:xxxx/home/”时，它才会成为您的根视图。看看这个沙盒来玩这个解决方案：

希望这可以帮助！