Vuejs 3 路由器 无法读取未定义的属性'push'

Question

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

实现直接来自vueschool页面，专门针对API的合成。

我在这里错过了什么？

每次我运行注册脚本时，它都会正确地注册用户，并记录在未定义的上找不到"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(){
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,
};
},

Answer 2

<script setup>
const router = useRouter()
function show_detail(row:any){
router.push({
path: '/host_add_check_item_detail',
params: row
})
}
</script>

路由器应在功能之外定义