Question

我正在尝试编写一个React + Redux组件（带有打字稿），该组件将从路由中加载：

<Route exact path="/a-path-to-my-page" component={MyComponent} />

但是我想在Dialog组件中加载相同的组件，但我的问题是我需要定义一个扩展RouteComponentProps的类型，以便在从路线加载时可以访问历史记录，位置和其他道具。从Dialog加载组件时需要所有这些道具，有没有办法定义某种条件类型，例如：

type MyComponentPropsRouter = RouteComponentProps.RouteComponentProps &
  MyComponentPropsFromStateType &
  MyComponentPropsFromDispatchType;

type MyComponentPropsNoRouter = MyComponentPropsFromStateType & MyComponentPropsFromDispatchType;

type MyComponentAllProps = MyComponentPropsRouter "or" MyComponentPropsNoRouter  //Is this possible?

谢谢！

我已尝试按照建议的here使用XOR，但这不是我想要的...

Answer 1

我通过使用RouteComponentProps创建具有所需属性的接口并通过以下方式将其他参数保留为条件来解决该问题：

interface MyComponentProps {
   history: History<any>;
   location?: Location<any>
   match?: match<{}> 
}

type MyComponentAllProps = MyComponentProps & MyComponentPropsFromState & MyComponentPropsFromDispatch;

那是唯一的方法吗？

再次感谢！

重用从路线加载的组件

1 个答案: