我们可以在vue路由中使用laravel刀片模板而不是vue组件吗? [英] Can we use laravel blade templates in vue routing instead of vue components?

问题描述

是否可以使用laravel刀片模板而不是vue组件来通过vue路由进行路由?我想像在Spa中使用vue路由那样路由刀片文件而不刷新页面.

Is it possible to use laravel blade templates instead of vue components to route using vue routing? I want to route my blade files without page refreshing as we do in Spa using vue routing.

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组件

I want to use blade files instead of vue components that I have made named as home and hello

推荐答案

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

You can use ajax to get html as response and render in vue.

在您的控制器中:

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

在您的Vue组件中，使用普通JS或jquery获取标记并将其绑定到组件

In your Vue component use vanilla JS or jquery to get the markup and bind it to the comonent

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

请注意，这并不是每种情况下真正可靠的解决方案.

Note that this is not a really reliable solution for every case.

这篇关于我们可以在vue路由中使用laravel刀片模板而不是vue组件吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！