我想添加一个简单的功能组件,它将用随机数据预填充我的Pinia存储并路由回主页。我尝试了useRouter
,但值未定义。
import { FunctionalComponent } from "vue";
import { useRouter } from "vue-router";
import { useUserProfileStore } from "./stores/UserProfile";
const Prefill: FunctionalComponent<{}> = (props, { slots, emit, attrs }) => {
const userProfileStore = useUserProfileStore();
const router = useRouter();
userProfileStore.randomData();
router.replace("/"); // but router is undefined?
};
Prefill.props = [];
Prefill.emits = [];
export default Prefill;
我把我的路线定义为
{
path: "/cheat",
name: "Prefill",
component: Prefill,
},
3条答案
按热度按时间qjp7pelc1#
看起来你是想在一个功能组件中使用
useRouter
钩子,你可以使用inject
函数将路由器示例注入到你的组件中,下面是一个例子:希望这能有所帮助!
ubbxdtey2#
与Mehdi的答案类似,但我使用了实际的路由器示例,而不是
inject("$router")
。Mehdi的答案是类型检查失败。
w8ntj3qf3#
函数式组件是无状态的,不会产生任何副作用,但它们可以通过与组件元素交互来触发事件:
在父组件中: