如何在 React-native 中调用 Field 渲染方法之外的函数？答案

【问题标题】：How do i call a function outside of Field render method in React-native?如何在 React-native 中调用 Field 渲染方法之外的函数？
【发布时间】：2019-09-01 17:45:20
【问题描述】：

各位专家，我是 react-native 的新手，我们将不胜感激。

我需要调用一个在 Component 中全局声明的方法名称 openModel()，并且我有一个方法 renderInput 来呈现在 Field 标记中传递的每个 Input。当 openModel() 在其 Inputs on Focus 的 renderInput 中被调用时。错误显示 _this4.openModel 不是函数。它清楚地理解这是因为多次调用 renderInput 方法而增加的。我该如何解决？ 以下是短代码

class AddPatientForm extends Component {
  constructor(props) {
    super(props);
    openModel = () => {

     this.refs.bGroup.open();

    }

    renderInput({ input, label, type, meta: { touched, error, warning } }) {

        return (
          <View style={{ flexDirection: "row", height: 25, paddingRight: 5, }}>
            <Input
              ref={c => { this.textInput = c }}
              returnKeyType={input.name === "Password" ? "" : "next"}
              onSubmitEditing={() => { this.textInput._root.focus(); }}
              blurOnSubmit={false}
              secureTextEntry={input.name === "Password"}
              {...input}
              onFocus={() => this.openModel()}
              keyboardType={input.name === "mobile" || input.name === "age" ? "numeric" : "default"}
              autoCapitalize="none"
            />
          </View>
        );
      }

     <Field name="patientId" component={this.renderInput} type="" validate={[alphaNumeric,required]} />
}

【问题讨论】：

标签： react-native react-redux render

【解决方案1】：

你可以像这样简单地写OpenModel() -

openModel() {

     this.refs.bGroup.open();

    }

希望它有效！

【讨论】：

【解决方案2】：

请从 constructor 中删除您的 openModel() 函数，如果您在 constructor 之外定义函数，它将对您有用

openModel = () => {
    this.refs.modal2.open();
}

您可以调用您的函数并在类内部定义，然后直接使用this.openModel();

如果你有全局函数并在类之外定义，那么你不需要使用this 关键字。

【讨论】：

感谢您的回复，我尝试调用 func openModel() 作为组件外部的构造函数，但 Modal 模块无法正常工作。它必须使用 this.refs.modal.open() 调用