Маршрутизатор не загружается - PullRequest
Новая
       10

Маршрутизатор не загружается

0 голосов
/ 28 января 2019

Я подключил компоненты к маршрутизатору, но он не загружается.Я использую Vue JS в Laravel.Я работаю с Laravel и Vue

Это мой блейд-файл Laravel.

home.blade.php 

<div id="app">
    <app-main></app-main>
</div>

AppMain.vue: 

<template>
  <div>
    <router-view></router-view>
  </div>
</template>

<script>

export default
{

}

App.js 

Vue.component('app-main', require('./components/front/common/AppMain.vue').default);
Vue.component('app-login', require('./components/auth/Login.vue'));


const routes = [
{ 
    path: '*', 
    component: require('./components/front/common/AppMain.vue')
},
{ 
    path: '/login', 
    component: require('./components/auth/Login.vue')
}
]

const router = new VueRouter({
   routes
})

const app = new Vue({
   el: '#app',
   router
});

Ошибка 

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <Anonymous>
       <AppMain> at resources/js/components/front/common/AppMain.vue
         <Root>

Ответы [ 3 ]

0 голосов
/ 29 января 2019

Пожалуйста, попробуйте этот код в app.js. 

import Vue from 'vue';
window.Vue = require('vue');

import VueRouter from 'vue-router';
Vue.use(VueRouter);

Vue.component('app-main',require('./components/front/common/AppMain.vue').default);
Vue.component('app-login', require('./components/auth/Login.vue'));

import appMain from './components/front/common/AppMain';
import appLogin from './components/auth/Login';


const routes = [
    {
      path: '/',
      component: appMain,
      children: [
          { 
              path: 'login',
              component: appLogin
          }
      ]
]

const router = new VueRouter({
   routes
})

const app = new Vue({
   el: '#app',
   router: router
});
0 голосов
/ 25 марта 2019

Пожалуйста, попробуйте с этим кодом увидеть, работает ли он. 

const app = new Vue({
    router,
    el: '#app',
    render: h => h(App) //add this new line
});
0 голосов
/ 28 января 2019

Вы пытались удалить ".default" из импорта компонента приложения?В мои первые годы работы с Vue / Laravel это меня тоже швырнуло.Я обнаружил, что безопаснее просто использовать "import from '../module path" "вверху" или "require (...)" состояния.Я не могу вспомнить, на какую спецификацию JavaScript это указывает.

...