i'm new to vue and i got this task to solve.
1.- I display some dummy data from index.html on my App.vue file
2.- The next step is to identify the language of the index.html without using vue-i18n
3.- My qustion is how do i get the attribute from index.html so that the laguage can be identify in App.vue file. I have search a lot of documention, men everything points to vue-i18n, and that's what it can't be used to solve this problem. Can someone explain it to me please?
This is my code
<!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>
And my App.vue file
<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>
Did you tried a simple query selector already?
function getLang () {
return document.querySelector('html').getAttribute('lang')
}