我有一個 Laravel 專案,我想集成 Vue。我沒有收到任何錯誤,但 Vue 組件沒有加載。如果我沒有收到錯誤,我想我犯了某種邏輯錯誤。
index.blade.php:
@extends('layouts.main')
@section('content')
<div id="app">
<productinfo-index></productinfo-index>
<audit-index></audit-index>
</div>
@endsection
應用程式.js:
require('./bootstrap');
window.Vue = require('vue').default;
import Vue from 'vue';
import VueRouter from 'vue-router';
import { routes } from './routes';
Vue.use(VueRouter);
Vue.component('productinfo-index', require('./components/productInfo/index.vue').default);
Vue.component('audit-index', require('./components/audit/index.vue').default);
const router = new VueRouter({
mode: 'history',
routes: routes
});
const app = new Vue({
el: '#app',
router: router
});
路線.js:
import ProductInfoIndex from './components/productInfo/index';
import Audit from './components/audit/index';
export const routes = [
{
path: '/productInfo',
name: 'ProductInfoIndex',
component: ProductInfoIndex
},
{
path: '/audit',
name: 'Audit',
component: Audit
}
];
審計/index.vue:
<template>
<div>Test</div>
</template>
<script>
export default {
}
</script>
<style>
</style>
uj5u.com熱心網友回復:
你有沒有在webpack檔案中為Vue組件添加配置?參考Laravel Mix Vue
laravel 團隊有一個 laravel/ui 包,它帶有使用 Vue 的腳手架:laravel/ui package。添加包并為 Vue 搭建腳手架。
composer require laravel/ui
php artisan ui vue
這種方法比嘗試自己設定一切要好,因為它還附帶了一個腳本,可以讓您自動注冊 Vue 組件
/**
* The following block of code may be used to automatically register your
* Vue components. It will recursively scan this directory for the Vue
* components and automatically register them with their "basename".
*
* Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
*/
const files = require.context("./", true, /\.vue$/i);
files
.keys()
.map((key) =>
Vue.component(key.split("/").pop().split(".")[0], files(key).default)
);
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/359414.html
