Rerunning IIFE function from external script added with useHead inside a component
Hi everyone! I have a component in Nuxt 3 application that shows an embeded form.
Script is IIFE function. My question is how can i on language change re-run that IIFE function again. The code above is not working (function is not rerun on language change)
The problem is that the script is same for all the languages, what changes is locale in this bit of a code:
but i need to rerun that IIFE function in script that is loaded in head again to form to be shown in different language when language is changed.
Any ideas?
Thanks!
<template>
<div :class="['form-embed', classList]" :style="background ? { backgroundColor: background } : ''">
<div :class="wrapper">
<h4>{{ props.data.form_embed_title }}</h4>
<p class="text">{{ props.data.form_embed_text }}</p>
<div class="form-container">
<div :id="props.data.form_embed_form_id" :lang="locale"></div>
</div>
</div>
</div>
</template>
<script setup>
const { locale } = useI18n();
const props = defineProps({
data: { type: Object, default: () => {} },
});
const { classList, background, wrapper } = useUseStyling(props.data, 'form_embed', false);
const scriptSrc = ref(props.data.form_embed_source_id);
const scriptRef = ref(null);
useHead({
script: [
{
id: props.data.form_embed_script_id,
src: scriptSrc.value + '?t=' + Date.now(),
defer: 'defer',
ref: scriptRef,
},
],
});
watch(locale, () => {
if (scriptRef.value) {
scriptRef.value.src = props.data.form_embed_source_id + '?t=' + Date.now();
// Adding a query parameter can help bypass browser caching
}
});
</script>Script is IIFE function. My question is how can i on language change re-run that IIFE function again. The code above is not working (function is not rerun on language change)
The problem is that the script is same for all the languages, what changes is locale in this bit of a code:
<div :id="props.data.form_embed_form_id" :lang="locale"></div>but i need to rerun that IIFE function in script that is loaded in head again to form to be shown in different language when language is changed.
Any ideas?
Thanks!
