如何在Laravel项目的JavaScript代码中设置路由名称？

问题说明 #

你最初的两种写法无法正常运行，核心原因是：

Laravel的route()辅助函数是服务端Blade模板渲染阶段执行的逻辑，而JavaScript的route_name参数是客户端代码运行时才存在的变量，两者执行时机完全错开，无法直接在Blade语法中嵌入JS运行时变量。

可行实现方案 #

方案1：预定义路由映射表（推荐，适配所有场景） #

这种方案性能最高、稳定性最好，支持带参数的路由：

1. 先在Blade模板的公共位置预生成前端需要用到的路由映射对象：

<script>
// 服务端提前渲染好所有前端要用到的路由
window.ROUTE_MAP = {
    'user.index': "{{ route('user.index') }}",
    'user.show': "{{ route('user.show', ['id' => '__USER_ID__']) }}",
    'post.store': "{{ route('post.store') }}"
    // 其他前端需要的路由都在这里补充定义
};
</script>

2. 你的JS方法直接从映射表中取值即可：

function assign_route(route_name, params = {}) {
    let url = ROUTE_MAP[route_name];
    if (!url) {
        throw new Error(`未找到指定路由：${route_name}`);
    }
    // 如有路由参数，替换对应的占位符
    Object.entries(params).forEach(([key, value]) => {
        url = url.replace(`__${key.toUpperCase()}__`, value);
    });
    return url;
}

方案2：占位符替换（仅适配无参数路由的简单场景） #

如果你只有少量无参数路由需要动态调用，可以用特殊占位符避免替换冲突，写法如下：

function assign_route(route_name) {
    // 先让服务端生成带唯一占位符的路由模板
    let url = "{{ route('__ROUTE_NAME_PLACEHOLDER_2024__') }}";
    // 客户端替换占位符为实际路由名
    url = url.replace('__ROUTE_NAME_PLACEHOLDER_2024__', route_name);
    return url;
}

注意：该方案不支持带参数的路由，且如果你的路由前缀、域名包含和占位符一致的字符串会出现替换错误，仅适合临时简单场景使用。

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