强烈键入对象属性以依赖于其他对象属性

Question

我正在尝试强烈键入React Context对象，并且我希望其中一个属性依赖于另一个属性。例如，我正在制作一个ModalContext，并且使用了与Redux操作类似的模式，其中有一个类型和有效负载，但是我将它们称为modalType和modalData，以便我可以通过数据通过上下文传递给模态。所以，这里有一些例子...

如果modalType = 'LOGIN MODAL'，则不传递任何数据，仅以模式显示登录表单。

如果为modalType = 'RENT MOVIE'，则为modalData = {movieId: 123456}，因此模态知道要播放的电影。

在站点管理员上下文中，如果为modalType = 'RESET USER PASSWORD'，则为modalData = {userId: 456789}，因此模式可以显示该用户。

这是我的上下文界面。

interface IModalContext {
  visible: boolean; 
  modalType:''|'LOGIN MODAL'|'RENT MOVIE'|'EDIT USER'; 
  modalData: any; 
}

究竟如何使modalData取决于modalType的值？

Answer 1

您将需要为此使用联合：

PUT file://file.json.gz @stage