react native 路由组件(prop)类型定义

import { Route, NavigationProp } from '@react-navigation/native';
import { FC } from 'react';

/**
 * @description 必须要传递RouteName
 * 当该组件是路由组件时, 使用该类型声明
 * @param RouteName 路由名字
 * @param Params 跳转路由时,传递的参数类型
 * @param ComponentProps 通常用不上,给函数组件传递的props
 */
export type FcWithRoute<
  RouteName extends string,
  Params extends object = {},
  ComponentProps extends { [key: string]: any } = {},
> = FC<
  ComponentProps & {
    navigation: NavigationProp<{ [key: string]: any }, RouteName>;
    route: Route<RouteName, Params>;
  }
>;

// 使用
type Parmas = {
  id: number;
};

const RequirePriceOrder: FcRoute<'RequirePriceOrder', Parmas> = props => {
  const {
    route: {
      params: { id: askPurchaseId },
    },
  } = props;

猜你喜欢

转载自blog.csdn.net/weixin_43416349/article/details/129063071
今日推荐