更改 laravel html 语言变量答案

【问题标题】：Change laravel html lang variable更改 laravel html 语言变量
【发布时间】：2020-12-15 02:08:47
【问题描述】：

我有支持多种语言的laravel/VueJs 应用程序，但有一个问题，当我在 VueJs 上更改语言时，html 语言标签不会改变。

代码

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="csrf-token" content="{{ csrf_token() }}" />
        <title>{{ config('app.name', 'Laravel') }}</title>
        <link href="{{ asset('css/app.css') }}" rel="stylesheet" />
        <style>body{ margin-bottom: 60px !important;}</style>
    </head>

    <body style="overflow:hidden;">
        <noscript>
        <strong>We're sorry but Xtreme Vuesax doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
        </noscript>
        <div id="app"></div>
        <script src="{{ asset('js/app.js') }}"></script>
        <script>
            window.default_locale = "{{ config('app.locale') }}";
            window.fallback_locale = "{{ config('app.fallback_locale') }}";
        </script>
    </body>
</html>

app.js

import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
import localesData from './components/Layouts/localesData'
Vue.component('locale-dropdown', require('./components/Layouts/locales').default);

const i18n = new VueI18n({
    locale: 'en',
    messages: localesData,
})

const app = new Vue({
    el: '#app',
    router,
    store,
    i18n,
    render: h => h(App)
});

说明

我需要将这一行 <html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> 更改为 VueJs 中的选定语言。

知道如何改变吗？

【问题讨论】：

标签： laravel vue.js vuejs2

【解决方案1】：

在你的 Vue 组件“locale-dropdown”中，当用户选择一个语言环境时，你可以

//say the data property on your component which holds the selected locale is called locale
let h = document.querySelector('html');
h.setAttribute('lang', this.locale);

【讨论】：

太棒了，谢谢。