Laravel中如何在JavaScript中正确使用语言变量？

直接在外部.js文件中写{{ __('folder/folder.file') }}不会生效，核心原因是Laravel的Blade模板引擎只会解析Blade视图文件中的语法，外部JS文件不会被Blade处理，以下是三种可行的解决方法：

方法一：在Blade视图中定义全局JS变量（推荐） #

在Blade模板的<script>标签中提前把需要的翻译文本定义为全局变量，再在外部JS文件中引用：

1. 在Blade视图文件中添加：

<script>
    // 定义全局翻译变量
    const lang = {
        noOrders: "{{ __('messages.no_orders') }}",
        orderSuccess: "{{ __('folder/folder.file') }}"
    };
</script>
<!-- 引入你的外部JS文件 -->
<script src="{{ asset('js/your-script.js') }}"></script>

2. 在外部JS文件中使用：

if (response == 0) {
    e.innerHTML = lang.noOrders;
} else {
    e.innerHTML = lang.orderSuccess;
}

方法二：将JS代码直接写在Blade视图的<script>标签中 #

如果JS逻辑代码量不大，可以直接把代码放在Blade文件里，这样Blade语法会被正常解析：

<script>
    // 这里可以写完整的JS逻辑
    if (response == 0) {
        e.innerHTML = "{{ __('messages.no_orders') }}";
    } else {
        e.innerHTML = "{{ __('folder/folder.file') }}";
    }
</script>

方法三：输出整个语言包为JS对象（适合多翻译场景） #

如果你的项目使用JSON格式的语言文件（如resources/lang/en.json），可以通过Blade把整个语言包转为JS对象：

<script>
    const translations = @json(__('*'));
</script>

之后在JS中通过键名直接访问翻译文本：

e.innerHTML = translations['folder/folder.file'];

注意：此方法会输出所有语言文本，适合需要大量翻译的场景，需考虑页面性能。

额外注意事项 #

• 确保语言文件路径正确，比如resources/lang/en/folder/folder.php中存在对应键值：

<?php
return [
    'file' => '过去90天内您收到了 :count 笔订单。'
];

• 若翻译文本包含占位符（如:count），在JS中使用时需手动替换：

// 假设count为订单数量
e.innerHTML = lang.orderSuccess.replace(':count', count);

内容的提问来源于stack exchange，提问作者Ontrable