Question

我目前正在尝试启动一个包含用户登录信息的 Vue 应用程序。出于某种原因，我一直在努力让这个路由器重定向工作。

该实现直接来自 vueschool 页面，并且专门针对组合 API。

我在这里遗漏了什么？

每次我运行注册脚本时，它都会正确注册用户并记录它找不到 undefined 的“push”属性的错误。我的代码完成告诉我它在那里，linting 工作正常，IDE Webstorm 没有给出任何错误。

<script>
import firebase from "firebase/app";
import "firebase/auth";
import { defineComponent, ref } from "vue";
import { useRouter } from "vue-router";

export default defineComponent({
  name: "Register",
  setup() {
    const form = ref({
      email: "",
      password: "",
      error: "",
    });

const pressed = () => {
  const user = firebase
    .auth()
    .createUserWithEmailAndPassword(form.value.email, form.value.password);

  user
    .then((user) => {
      console.log(user);
      const router = useRouter();
      router.push("/about");
    })
    .catch((e) => console.log(e.message));
};

    return {
      form,
      pressed,
    };
  },
});
</script>

希望这只是一些简单的事情

Answer 1

const router = useRouter(); 必须在 setup hook 的范围内声明，而不是在任何内部范围内：

setup(){

   const router = useRouter();

    const form = ref({
      email: "",
      password: "",
      error: "",
    });

const pressed = () => {
  const user = firebase
    .auth()
    .createUserWithEmailAndPassword(form.value.email, form.value.password);

  user
    .then((user) => {
      console.log(user);
     
      router.push("/about");
    })
    .catch((e) => console.log(e.message));
};

    return {
      form,
      pressed,
    };
  },

Vuejs 3 路由器无法读取未定义的属性“推送”

1 个答案: