首页 > 解决方案 > 在本机反应中扩展通用道具

问题描述

抱歉,如果标题具有误导性。我似乎找不到合适的标题。我有两个班。

****************Form.tsx

interface Props{}
interface State{}
class Form extends Component<Props, State>{
   protected submit(){
      // contains a code when form submits
   }
}



****************Login.tsx

class LoginForm extends Form{
   render(){
       return(
          <View>
            <Button onClick = {() => this.props.navigation.goBack()}
            <Button onClick= {() => this.submit()} />
          </View>

       );
   }
}

我想做这个

<LoginForm navigation = {someObject} />

但我不能这样做,因为我似乎找不到解决方法。我只是想知道如何将更多道具传递给 LoginForm。

标签: typescriptreact-nativereact-navigation

解决方案


我找到了一个解决方案,但它只有在表单始终被扩展且不用作组件时才有效。在我的示例中,我从未打算将表单用作组件。因此,如果有帮助,这是一个解决方案。

***********Form.tsx
interface State{}
class Form<P= {}> extends Component<P, State>{

}

***********Login.tsx
interface LoginFormProps{
   navigation: SomeObjectType
}

class Login extends Form<LoginFormProps>{
}

然后我可以做

<LoginForm navigation = {someObject} />

推荐阅读