Laravel Blade 模板:兼容 JavaScript 框架变量 1 个改进

介绍

由于很多 JavaScript 框架也使用花括号表明给定的表达式将要在浏览器中显示,比如 Vue:

<div id="example">
  {{ message.split('').reverse().join('') }}
</div>

Vue 和 Laravel 一样使用 {{ }},那么需要使用 @{{ }}@verbatim 指令来正确输出 Vue 代码

两种方式

@ 前缀

, 可以使用 @ 符号通知 Blade 渲染引擎某个表达式应保持不变。示例如下:

<h1>Laravel</h1>

Hello, @{{ name }}.

在这个例子中, @ 符号将被 Blade 删除;在 Blade 引擎中 {{ name }} 表达式将保持不变,取而代之的是 JavaScript 引擎将渲染该表达式。

@verbatim 指令

如果要在大段的模板中 JavaScript 变量,可以将 HTML 包裹在 @verbatim 指令中,这样就不需要为每个 Blade 回显语句添加 @ 符号:

@verbatim
    <div class="container">
        Hello, {{ name }}.
    </div>
@endverbatim
本文为 Wiki 文章,邀您参与纠错、纰漏和优化
讨论数量: 0
(= ̄ω ̄=)··· 暂无内容!

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!