ReactネイティブアプリでTextInputを事前入力する方法は？

私はReactネイティブアプリにTextInputコンポーネントを持っています。そして、フィールドに408xx810xxxのマスク、フィールドの1〜3および6〜8桁を事前に入力する必要があります。ユーザーに変更を加えることは禁止されています。

          <TextInput
            style={[SS.input, styles.input]}
            placeholder={props.placeholder} placeholderTextColor={theme.inputPlaceholder}
            underlineColorAndroid='transparent' editable={!props.disabled}
            keyboardType={props.keyboardType || 'default'} autoCapitalize={capitalize}
            keyboardAppearance={props.keyboardAppearance}
            autoCorrect={autoCorrect} selection={state.position}
            secureTextEntry={this.state.guarded}
            value={this.state.value}
            onChangeText={this._onChangeText}
            onFocus={this._onFocus} onBlur={this._onBlur}
            autoFocus={props.autoFocus}
            multiline={props.multiline}
            maxLength={props.maxLength}
            onContentSizeChange={onContentSizeChange}
          />

javascriptfunctionreact-nativemasktextinput

2019/12/17jocoders

React-native-masked-textライブラリーを使用することがわかった最良の決定：

import { TextInputMask } from 'react-native-masked-text';

            <TextInputMask
              type='custom' 
              options={{mask: accountMask}} 
              maxLength={20}
              customTextInput={InputText} 
              customTextInputProps={this._loginMaskProps}
              value={vm.checkingAccount} keyboardType={'number-pad'}
              placeholder={accountPlaceholder} 
              onChangeText={vm.changeCheckingAccount}
            />

プロパティタイプを「カスタム」に設定して、マスクを作成する必要があります https://github.com/benhurott/react-native-masked-text ライブラリ、私の場合は次のようになります：

 const accountMask = '40899810999999999999',

2019/12/19jocoders