在组合Laravel和Vuejs时，您更喜欢使用哪种模式

据我所知，在视图中使用Vuejs有两种方法：内联模板和组件

#1。内联模板

我要用这个系列的代码来表达我的观点

线程控制器：

public function show($channel, Thread $thread, Trending $trending)
    {
        if (auth()->check()) {
            auth()->user()->read($thread);
        }

        $trending->push($thread);

        $thread->increment('visits');

        return view('threads.show', compact('thread'));
    }

视图（threads.show）

@extends（'layouts.app'））
@第节（“标题”）
@端部
@节（“内容”）
@包括（'线程。\问题'）

此线程由{{$thread->created_at->diffForHumans（）}发布
，目前
有{{str_复数（'comment'，$thread->replays_count）}
.



@端部

ThreadView组件不包含

标记

Taylor仍然使用刀片作为默认，并在需要时导入Vuejs组件

#2。组件：如上所述，但视图中的所有内容都将被放入

标记中

---

我应该在我的项目中使用哪种方式？我看不出两种方法的优点和缺点。我能看到的唯一一件事是，如果我使用内联模板，我可以提前使用Laravel Collection helper或blade指令（@auth，@guest）。

我认为这取决于您打算实现的接口的复杂性。就我个人而言，我使用Vuejs及其全部功能作为应用程序的前端层。在这种情况下，您可以使用Vue路由器在页面之间进行更平滑的转换，也可以使用Vuex作为前端层的存储管理

总之，如果要实现SPA（单页应用程序），请选择第二种方法。但是，如果您只想使用VueJ的有限功能，请继续第一种方法

@extends('layouts.app')

@section('head')
    <link rel="stylesheet" href="/css/vendor/jquery.atwho.css">
@endsection

@section('content')
    <thread-view :thread="{{ $thread }}" inline-template>
        <div class="container">
            <div class="row">
                <div class="col-md-8" v-cloak>
                    @include ('threads._question')

                    <replies @added="repliesCount++" @removed="repliesCount--"></replies>
                </div>

                <div class="col-md-4">
                    <div class="panel panel-default">
                        <div class="panel-body">
                            <p>
                                This thread was published {{ $thread->created_at->diffForHumans() }} by
                                <a href="#">{{ $thread->creator->name }}</a>, and currently
                                has <span
                                        v-text="repliesCount"></span> {{ str_plural('comment', $thread->replies_count) }}
                                .
                            </p>

                            <p>
                                <subscribe-button :active="{{ json_encode($thread->isSubscribedTo) }}" v-if="signedIn"></subscribe-button>

                                <button class="btn btn-default"
                                        v-if="authorize('isAdmin')"
                                        @click="toggleLock"
                                        v-text="locked ? 'Unlock' : 'Lock'"></button>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </thread-view>
@endsection