我有laravel/VueJs应用程序，它支持多种语言，但有一个问题，当我在VueJs html上更改语言时，Lang标记不会更改。
代码
<!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中的选定语言。
知道如何改变吗
在Vue组件的"区域设置下拉列表"中，当用户选择一个区域设置时，您可以
//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);