в laravel 5.6 и vue.js не работают - PullRequest
       6

в laravel 5.6 и vue.js не работают

0 голосов
/ 21 сентября 2018

Я не знаю, что я делаю неправильно, но мой роутер-просмотр не работает.

У меня есть приложение, основанное на Laravel 5.6, и я хочу создавать представления через vue.js.Компоненты "Navbar" и "Foot" загружены правильно, но я не вижу компонента "Home", который должен быть загружен в App.vue

Маршрутизация также не работает.Когда я набираю в браузере / о программе, я получаю сообщение об ошибке «Извините, страница, которую вы ищете, не может быть найдена».

Ниже моих файлов:

App.vue

<template>
    <div class="app">
        <Navbar/>
        <router-view></router-view> 
        <Foot/>
    </div>
</template>

<script>
export default {
    name: 'App',
    data () {
        return{

        }
    }
}
</script>

Home.vue

<template>
    <div class="home">
        <h1>Home</h1>   
    </div>
</template>

<script>
export default {
    name: 'Home',
    data () {
        return {

        }
    }

}
</script>

About.vue

<template>
    <div class="about">
        <h1>O nas</h1>
    </div>
</template>

<script>
export default {
    name: 'About',
    data (){
        return{

        }
    }
}
</script>

app.js

require('./bootstrap');
import Vue from 'vue';
import VueRouter from 'vue-router';
import Vuex from 'vuex';

window.Vue = require('vue'); 

Vue.use(VueRouter);
Vue.use(Vuex);

let AppLayout = require('./components/App.vue');

// home tempalte
const Home = Vue.component('Home', require('./components/Home.vue'));
// About tempalte
const About = Vue.component('About', require('./components/About.vue'));

// register components
const Navbar = Vue.component('Navbar', require('./components/Navbar.vue'));
const Foot = Vue.component('Foot', require('./components/Foot.vue'));

const routes = [
    {
        path: '/',
        name: 'Home',        
        component: Home
    },
    {

        name: 'About', 
        path: '/about',   
        component: About
    }
];

const router = new VueRouter({ mode: 'history', routes: routes});

new Vue(
    Vue.util.extend(
        { router },
        AppLayout
    )
).$mount('#app');

1 Ответ

0 голосов
/ 21 сентября 2018

Вам нужно научить роутер Laravel, как играть вместе с Vue.
Проверьте эту ссылку: https://medium.com/@piethein/how-to-combine-vuejs-router-with-laravel-1226acd73ab0

Вам нужно прочитать, где написано:

Route::get('/vue/{vue_capture?}', function () {
 return view('vue.index');
})->where('vue_capture', '[\/\w\.-]*');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...