javascript - 如何在 Vue 文件中使用 Blade？

Question

我正在尝试在我的 Vue 文件中使用 Blade carousel-signUp.vue

喜欢:

<template>
    <div>           
        <form action="{{route('dump')}}" method="POST" >
           /* Some code here...*/
        </form>
   </div>
</template>

但最后我得到了一个错误。

编译器无法理解 Vue 语法和 Blade 语法的区别。如何在 Vue 文件中定义 Blade 语法？

或者，有人知道如何在我的 vue 文件中使用 {{route('dump')}} 值吗？

Answer 1

更好的解决方案可能是将所需的 Blade 变量输出到(隐藏的)html 并在您的 Vue 代码中选择该 html。使用 @ 转义 Vue 的花括号。

你的 Blade example.blade.php

<div id="content" hidden>
    {{ bladeVar }}
</div>

<div id="app">
    @{{ vueVar }}
</div>

该 Blade 的结果(它在缓存文件中的样子)+ javascript (Vue)

var app = new Vue({
    el: '#app',
    data: {
        vueVar: document.getElementById('content').innerHTML + 'from Vue'
    }
});

<script src="https://unpkg.com/vue"></script>
<div id="content" hidden>
    Hello world
</div>

<div id="app">
    {{ vueVar }}
</div>

我找到了 a post having the same issue as you