Quiero cambiar bt.name_en , bt.text_en y bt.date_en a medida que cambia LocalStorage ( const local = localStorage.getItem("inLan"); ).

Si const local (const local = localStorage.getItem("inLan"); es igual a name_jp , entonces el nombre, el texto y la fecha cambian a "JP" ( bt.name_jp , bt.text_jp y bt.date_jp ) también. ¿Cómo puedo hacer esto de manera efectiva y correcta?

 <template> <div class="about"> <Header /> <div class="line"> <ul> <li v-for="bt in list" :key="bt.id"> <div class="line-cont"> <h2 class="dateX" >{{ bt.date_en }}</h2> <h1>{{ bt.name_en }}</h1> <p>{{ bt.text_en }}</p> <div class="divm"> <img class="img" :src="bt.image" alt=""> </div> </div> </li> </ul> </div> <Footer /> </div> </template> <script> import { computed } from "vue"; import { l } from "@/modules/languages"; import useAb from "@/modules/About"; import Header from "@/components/Header.vue"; import Footer from "@/components/Footer.vue"; export default { name: "About", components: { Header, Footer, }, setup() { const cards = useAb(); const list = computed(() => cards.state.abouts); const local = localStorage.getItem("inLan"); return { l, list, local, }; }, }; </script>