0
<script setup ...>
is a just syntactic sugar. There’s no need for this component to have both <script>
and <script setup>
tags.
It can be defined within a single <script setup>
like this:
<script setup lang="ts">
// The imports from your <script> tag minus defineComponent (not needed)
import Spinner from '../common/Spinner.vue';
import Questionnaire from '../Questionnaire/Questionnaire.vue';
import WelcomeScreen from '../common/WelcomeScreen.vue';
import ThankYouScreen from '../common/ThankYouScreen.vue';
import { useStore } from 'vuex';
import { withDefaults, defineProps, computed, ref, toRefs, watch } from 'vue';
import emojiRegex from 'emoji-regex';
import {
AdditionalParameters,
QuestionnaireScreen,
QuestionnaireConfig,
QuestionnaireStyles,
RawQuestionnaireStyles,
QuestionnaireAnswer,
SubmitAnswersFunction,
} from '../../lib/types';
import { checkAdditions, lightenDarkenColor } from '../../lib/main';
// The line in your <scripts> setup() function.
const store = useStore();
const props = withDefaults(
defineProps<{
isLoading?: boolean;
additions: AdditionalParameters;
questionnaireConfig: QuestionnaireConfig;
questionnaireStyling?: RawQuestionnaireStyles | null;
submitAnswers: SubmitAnswersFunction;
goBack: () => void;
}>(),
{ isLoading: undefined, questionnaireStyling: null }
);
//Function which need access to store from script1 and questionnaireConfig from script 2
const processedRedirectUrl = computed(() => {
const url = populatePlaceholdersInLinkQueryParameters(
redirectUrl.value,
// **** NEED STORE ACCESS ****
// store.getters.userProfile
);
return url;
});
const finishClickHandler = (): void => {
props.submitAnswers(questionnaireConfig.value, tAnswers.value, tScore.value);
if (
questionnaireConfig.value.thankyou_screens[0] &&
questionnaireConfig.value.thankyou_screens[0] !== null
) {
window.location.replace(processedRedirectUrl.value);
} else {
console.log("hello")
}
};
</script>
- [Vuejs]-OAuth login with Laravel 10 and VueJS 3
- [Vuejs]-Vuejs how to split v-progress linear as 4 piece or are there any option for this design? Vuetify 2
Source:stackexchange.com