Laravel Vue 变量答案

【问题标题】：Laravel Vue VariableLaravel Vue 变量
【发布时间】：2019-03-16 14:55:20
【问题描述】：

我无法理解如何在 Laravel 中将 Vue 变量与 Blade 模板结合起来。

这行得通：

<ul id="media" v-if="files !== null">
    <li v-for="item in files">
        @{{ item.file }}
    </li>
</ul>

这不起作用：

<ul id="media" v-if="files !== null">
    <li v-for="item in files">
        <img src="{{ url('/storage') }}@{{ item.file }}">
    </li>
</ul>

如何将 Blade 模板与 Vue 结合使用？

【问题讨论】：

这些是单文件的 Vue 组件，或者你是如何在页面上使用它们的？我需要来自视图的更多上下文（更多代码），可能还有 javascript（你做的部分new Vue()）
我在普通刀片模板中使用它，而不是作为组件。 vue 中的变量设置正确，一切正常。问题是，如果我在 img html 部分中使用变量 @{{ item.file }}，则不再翻译它。

【解决方案1】：

我自己找到了解决方案 - 必须这样使用：

<img :src="'storage/' + item.file">

【讨论】：

【解决方案2】：

您必须将 vue 数据对象绑定到 html 属性。

【讨论】：