From 92e14cfef00a7c508aa32c738497b52da02d69d3 Mon Sep 17 00:00:00 2001
From: Cee <cnell@usgs.gov>
Date: Fri, 20 Sep 2024 16:14:20 -0700
Subject: [PATCH] watch language in references
---
src/components/ReferencesSection.vue | 68 +++++++++++++++-------------
1 file changed, 37 insertions(+), 31 deletions(-)
diff --git a/src/components/ReferencesSection.vue b/src/components/ReferencesSection.vue
index bfe18a3..c480153 100644
--- a/src/components/ReferencesSection.vue
+++ b/src/components/ReferencesSection.vue
@@ -22,43 +22,49 @@
<script>
import { useI18n } from 'vue-i18n';
+import { ref, watch } from 'vue';
export default {
name: 'ReferencesSection',
- data() {
- return {
- text: {}
- };
- },
- created() {
+ setup() {
const { locale } = useI18n();
- const lang = locale.value;
+ const text = ref({});
+
+ const loadReferencesText = (lang) => {
+ if (lang === 'es') {
+ import('@/assets/text/referencesText_es.js')
+ .then((module) => {
+ text.value = module.default.referencesContent;
+ sortReferences();
+ })
+ .catch((error) => console.error('Failed to load Spanish references:', error));
+ } else {
+ import('@/assets/text/referencesText_en.js')
+ .then((module) => {
+ text.value = module.default.referencesContent;
+ sortReferences();
+ })
+ .catch((error) => console.error('Failed to load English references:', error));
+ }
+ };
- // Dynamically import the correct references file based on the language
- if (lang === 'es') {
- import('@/assets/text/referencesText_es.js')
- .then((module) => {
- this.text = module.default.referencesContent;
- this.sortReferences();
- })
- .catch((error) => console.error('Failed to load Spanish references:', error));
- } else {
- import('@/assets/text/referencesText_en.js')
- .then((module) => {
- this.text = module.default.referencesContent;
- this.sortReferences();
- })
- .catch((error) => console.error('Failed to load English references:', error));
- }
- },
- methods: {
- sortReferences() {
- if (this.text.references && Array.isArray(this.text.references)) {
- this.text.references.sort((a, b) => {
- return a.authors.localeCompare(b.authors);
- });
+ const sortReferences = () => {
+ if (text.value.references && Array.isArray(text.value.references)) {
+ text.value.references.sort((a, b) => a.authors.localeCompare(b.authors));
}
- }
+ };
+
+ // Initial load based on current language
+ loadReferencesText(locale.value);
+
+ // Watch for changes in the locale and update the references accordingly
+ watch(locale, (newLocale) => {
+ loadReferencesText(newLocale);
+ });
+
+ return {
+ text
+ };
}
};
</script>
--
GitLab