bootstrap-table本地化配置未达预期，浏览器语言判断异常问题

问题原因 #

• 多locale文件全局覆盖：你一次性引入了两个locale文件，bootstrap-table的locale文件加载后会覆盖全局默认配置，后加载的fr-BE文件会优先成为默认值，部分场景下会覆盖你初始化时传入的locale配置
• 语言匹配逻辑不严谨：navigator.language返回值存在格式差异（比如部分环境返回fr_be、FR、fr-CA等），你的全等判断只能匹配3种固定格式，法语变体漏匹配、非法语场景误匹配都可能出现
• 变量污染：代码中language变量未声明直接赋值，成为全局变量，可能被页面其他脚本修改，导致locale取值异常
• 重复初始化失效：如果表格此前已经被初始化过，再次调用bootstrapTable({locale: xxx})不会生效，需要调用专用方法更新配置

修正方案 #

1. 调整语言匹配逻辑，先对用户语言做归一化处理，只匹配主语言码即可覆盖所有法语场景
2. 声明language变量避免全局污染
3. 如果存在重复初始化的情况，改用refreshOptions更新配置
4. 可选优化：不要一次性引入两个locale文件，根据匹配结果动态引入对应locale文件，避免全局覆盖问题

修正后代码

<script src="https://unpkg.com/bootstrap-table@1.18.3/dist/bootstrap-table.min.js"></script>
<script src="{% static 'js/bootstrap-table-nl-BE.js'%}"></script>
<script src="{% static 'js/bootstrap-table-fr-BE.js'%}"></script>
<script>
$(document).ready(function() {
    // 归一化语言：转小写，统一分隔符为横杠，提取主语言码
    const userLang = (navigator.language || navigator.userLanguage || 'nl').toLowerCase().replace('_', '-');
    const mainLang = userLang.split('-')[0];
    // 所有法语主语言都匹配fr-BE，其余默认nl-BE
    const language = mainLang === 'fr' ? 'fr-BE' : 'nl-BE';

    // 兼容表格已初始化的场景
    if ($.fn.bootstrapTable.utils.isBootstrapTable($('#table'))) {
        $('#table').bootstrapTable('refreshOptions', {locale: language});
    } else {
        $('#table').bootstrapTable({
            locale: language
        });
    }
})
</script>

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