我们可以在 vue 路由中使用 laravel 刀片模板而不是 vue 组件吗？答案

【问题标题】：Can we use laravel blade templates in vue routing instead of vue components?我们可以在 vue 路由中使用 laravel 刀片模板而不是 vue 组件吗？
【发布时间】：2019-11-07 08:43:44
【问题描述】：

是否可以使用 laravel 刀片模板而不是 vue 组件来使用 vue 路由进行路由？我想在不刷新页面的情况下路由我的刀片文件，就像我们在 Spa 中使用 vue 路由一样。

import App from './views/App'
import Hello from './views/Hello'
import Home from './views/Home'
const router = new VueRouter({
    mode: 'history',

    routes: [
        {
            path: '/',
            name: 'home', 
            component: Home //Vue Component
        },
        {
            path: '/hello',
            name: 'hello',
            component: Hello, //Vue Component
        },
    ],
});

我想使用刀片文件而不是我制作的名为 home 和 hello 的 vue 组件

【问题讨论】：

标签： laravel vue.js laravel-5

【解决方案1】：

您可以使用 ajax 获取 html 作为响应并在 vue 中呈现。

在您的控制器中：

public function renderHtml()
{
   $data = ... ;
   $html = view('test',compact('data')->render();
   return response()->json($html);
}

在你的 Vue 组件中使用 vanilla JS 或 jquery 来获取标记并将其绑定到组件

fetch('renderhtml')
   .then(response => () {
       element.innerHTML(response.data);
});

请注意，这并不是适用于所有情况的真正可靠的解决方案。

【讨论】：

Noual Fouzi 先生！但随后我必须将每个刀片文件渲染为 json 响应，然后获取它，这也是一个漫长的过程。
我只想知道是否可以使用刀片文件而不是 vue 组件来使用 vue 路由进行路由？目前我需要为每个刀片文件制作组件，以便我可以应用 vue 路由，但这对于大型应用程序没有用。

【解决方案2】：

据我所知，你不能。由于 Laravel 实际上并没有为您提供 *.blade.php 文件，而是将它们编译为纯 PHP，放入 storage/framework/views （默认情况下） 文件夹，然后提供服务。

来自official docs：

事实上，所有 Blade 视图都被编译成普通的 PHP 代码并被缓存，直到它们被修改

所以在任何情况下，都必须发生 页面刷新 来为其他 PHP 文件提供服务。

【讨论】：