React-Native - Как заменить функциональность реагирующего нативного компонента ядра

Question

Я уже создал веб-приложение, и мне нужно преобразовать его в приложениеact-native-ios.Я создал виджет TextInput для веб-приложения, который делает больше, чем просто активный компонент TextInput.

1. Как перезаписать основные функции TextInput, такие как метод onchange.

2. Как добавить дополнительные функции в TextInput.

Виджет TextInput веб-приложения написан на JavaScript.Я хочу избежать цели-С, если это вообще возможно.

Спасибо.

Answer 1

Если я правильно понимаю, здесь не нужно ничего реагировать - специфично для вас.Вы просто используете стандартные методы реагирования для добавления функциональности к существующим компонентам.Таким образом, вы можете создать компонент, который обёртывает TextInput, что позволяет вам передавать мысли, которые принимает любой объект TextInput.И вы также можете предоставить дополнительные реквизиты для вашего компонента для других требований.

import * as React from 'react';
import { 
  TextInput
} from 'react-native';

class CustomInput extends React.Component {

  constructor(props) {
    this.state = {text: 'default text'}
  }

  render(): JSX.Element {

    return (
      <TextInput
        {...this.props} // pass through props
        value={this.state.text}
        onChangeText={this.onChangeText} // update value as usual
        onChange={this.props.doSomethingSpecial} // call custom prop function for custom behaviour
      />
    ); 
  }

  onChangeText = (text) => {
    this.setState({text});
  }
}

export default CustomInput;