0๐
โ
I now found the solution to my problem. I moved setUserState() as a function under setup() and deleted the methods. Setup is setting up the store now and returns setUserState. Following code works:
<script lang="ts">
import {defineComponent, reactive} from 'vue'
import userStore from '../store/user'
import { useStore } from "vuex";
export default defineComponent({
setup() {
const store = useStore();
const form = reactive({
username: "",
password: "",
});
//Calls the login function in user.ts
function onSubmit() {
userStore.login(form.username, form.password);
form.username = "";
form.password = "";
setUserState()
}
function setUserState(){
store.dispatch("setActiveUser");
}
//Returns the store in the main so that the form can have a template that displays the error message.
return {form, userStore, onSubmit, setUserState}
},
})
</script>
Source:stackexchange.com