Question

我想将VueJS添加到基于Laravel的多页应用程序中。

嗯-Vue提供了很多功能，但是我真的很想继续使用Laravel的路由机制，只添加VueJS来增强我的项目。

所以我的问题是：由于Laravel随附了app.js，其中包括基本的Vue脚手架，因此我无法为不同的页面添加不同的行为：

resources/assets/js/app.js：

require('./bootstrap');

window.Vue = require('vue');


Vue.component('example-component', require('./components/ExampleComponent.vue'));

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

如果我为每个刀片视图仅添加新的.js文件，对吗？例如。 home.js，register.js并将它们包括在我的视图中？

Answer 1

编写Vue组件

默认情况下，新的Laravel应用程序包含一个位于Resource / assets / js / components目录中的ExampleComponent.vue Vue组件。 ExampleComponent.vue文件是单个文件Vue组件的示例，该组件在同一文件中定义其JavaScript和HTML模板。 单个文件组件为构建JavaScript驱动的应用程序提供了一种非常方便的方法。该示例组件已注册到您的 app.js 文件中：

Vue.component(
    'example-component',
    require('./components/ExampleComponent.vue')
);

要在应用程序中使用组件，可以将其放入HTML模板之一。例如，在运行make：auth Artisan命令以搭建应用程序的身份验证和注册屏幕之后，您可以将该组件放入home.blade.php Blade模板：

@extends('layouts.app')

@section('content')
    <example-component></example-component>
@endsection

将VueJS添加到Laravel，但继续使用Laravel的路由器等

1 个答案: