Laravel-具有单个Vue实例的Vue多页面应用程序

时间:2019-02-11 18:35:45

标签: laravel vue.js vuejs2 multi-page-application

我正在使用Laravel进行项目,并且想切换Vue。这是我现在的设置示例:-

“ routes / web.php”

Route::get('/home', 'HomeController@home');
Route::get('/about', 'HomeController@about');
Route::get('/blogs', 'HomeController@blogs');

“ views / master.blade.php”

<!DOCTYPE html>
<html>
  <head>
    <title>@yield('title')</title>
    <!-- AND OTHER STUFF -->
  </head>
  <body>
    <!-- NAV BAR -->


    <div id="app">
      @yield('content')
    </div>


    <script src="app.build.js"></script>
  </body>
</html>

“ views / pages / home.blade.php”

@extends('master')

@section('title', "Home")

@section('content')
  <home-content
    customproperties="{{ $somedata }}"
  ></home-content>
@endsection

“ app.js”

var vm = new Vue({
    data(){
        return {

        }
    },
    components: {
        HomeContent,
        AboutContent,
        BlogsContent
    }
})

假设我已经准备好所有组件并且工作正常。问题是,我做对了吗?我不想因为项目复杂性而使其成为一个单页应用程序,而是希望以混合方式进行。所有vue组件都将具有其各自的页面,有些页面甚至将不具有vue组件,而只有平原刀片页面。

例如,静态页面可能看起来像这样:-

@extends('master')

@section('title', "Static Page")

@section('content')
  Just a static page, it has nothing to do with vue, but still sitting inside Vue instance's template scope.
@endsection

对于这些页面,正在加载vue脚本,并且“ #app”被解释为模板。但是此页面不会用于vue。这样离开是否很好?还是为此存在更优化的方法?

欢迎提供有关Laravel-Vue多页应用程序最佳实践的任何建议。

0 个答案:

没有答案