[Vuejs]-Vue Firebase: router is undefined

by

0👍

Review the Vue 3 composition syntax for the setup() function in the Vue docs as well as the Vue-Router docs. Your variables and functions should go inside the setup() function (hence why setup returns them).

<script lang="ts">
import { ref } from 'vue';
import { getAuth, createUserWithEmailAndPassword } from 'firebase/auth';
import { useRouter } from 'vue-router';

export default {
  name: 'SignUp',
  setup() {
    const email = ref('');
    const password = ref('');
    const router = useRouter();

    const signUp = (): void => {
      createUserWithEmailAndPassword(getAuth(), email.value, password.value)
        .then(data => {
          console.log('Success');
          router.push('/feed');
        })
        .catch(error => {
          console.log(error.code);
          alert(error.message);
        });
    };

    const signInWithGoogle = (): void => {
      // Add your code to sign in with Google here
    };
    return {
      email,
      password,
      router,
      signUp,
      signInWithGoogle
    };
  }
};
</script>

Leave a comment