在 JavaScript 变量中使用 blade

Question

我今天早上醒来时遇到了一个愚蠢的问题。你能把 blade 放在 JavaScript 变量里吗：

 var NoImg = '{{ asset('img/ni-img.png') }}';

它将输出为一个字符串，我只需要它来输出一个图像

Answer 1

是的 - 这会直接将图像的路径注入到 JS 字符串的单引号中。

如果您需要将该字符串用作图像，则需要将 img .src 设置为路径，例如

document.getElementByID('myImage').src = '{{ asset('img/ni-img.png') }}'

Answer 2

是的。 Blade 是服务器端模板引擎。如果您有一个 blade 查看文件，她将在 javascript 之前执行。在您的情况下，当从服务器返回 html 时，NoImg 将具有助手 asset() 返回的扩展值。

这会很好：

<?php
    // variable from your controller...
    $image = 'https://images.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png';
?>

// your js inside of a blade file...
var image = new Image(272, 92);
image.src = '{{ $image }}'; // or asset("path/to/your/image.png")
document.body.appendChild(image);

Answer 3

是的，但最好使用 json_encode 以确保生成的输出 JavaScript 友好：

var NoImg = {!! json_encode(asset('img/ni-img.png')) !!};

PHP 将添加引号（对于字符串）、任何必要的转义字符（例如，如果您的文件名中有 '），并将处理更复杂的数据结构，例如arrays/objects 也是。

在 JavaScript 变量中使用 blade

Use blade inside a JavaScript variable

javascript

laravel

laravel-blade

laravel-5.3