如何在不使用 vue-i18n 的情况下识别 vue 文件中 HTML 上的 lang 属性

问题描述 投票:0回答:1

我是 vue 新手,我需要解决这个任务。

1.- 我在 App.vue 文件上显示来自 index.html 的一些虚拟数据

2.- 下一步是在不使用 vue-i18n 的情况下识别 index.html 的语言

3.- 我的问题是如何从index.html 获取属性,以便可以在App.vue 文件中识别语言。我查了很多文档,一切都指向vue-i18n,这就是它不能用来解决这个问题。有人可以给我解释一下吗?

这是我的代码

<!DOCTYPE html>
**<html lang="en">** // This is what i to need to get 
  <head>
    <meta charset="UTF-8">
    <link rel="icon" href="/favicon.ico">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Vite App</title>
  </head>
  <body>
    <div id="app"></div>
    <script>
      const dummyData = {
        name: "Peter",
        age: 37
      }
    </script>
    <script type="module" src="/src/main.js"></script>
  </body>
</html>

还有我的 App.vue 文件

<script setup>
import { ref, computed } from 'vue'
const person = computed(() => {
    return dummyData.name
})
const years = ref(dummyData.age)
</script>
    
<template>
    <div class="m-0 row vh-100 justify-content-center align-items-center "> 
        <div class="col-auto bg-primary p-5 text-center text-white rounded-3 ">
            <p>{{ person }} it's my name</p>
            <p>I'm {{ years }} years old</p>
        </div>
    </div>
</template>
attributes vuejs3 lang
1个回答
0
投票

您是否已经尝试过简单的查询选择器?

function getLang () {
    return document.querySelector('html').getAttribute('lang')
}
© www.soinside.com 2019 - 2024. All rights reserved.