<script setup lang="ts">
import router from '@/router';
import { useMainStore } from '@/stores/main';
import { ref } from 'vue';
const mainStore = useMainStore();
const x = ref<object| undefined>();
if (!mainStore.x) {
router.replace('/');
} else {
x.value = mainStore.x;
}
if (!x.value) {
router.replace('/');
} else {
console.log(x.value.location);
}
function fun() {
if (!x.value) {
router.replace('/');
return 5;
}
return x.value.location;
}
</script>
I am looking for a way to exit this single file component if mainStore.x is undefined. Once I have confirmed that mainStore.x is not undefined, I don't need to keep checking if x.value is defined every time I use it.
By using router.replace to navigate to a different single file component, I ensure that x.value will never be undefined in this component.