setNativeProps is not a function

[cassioseffrin]

Hello,

First: thks for sharing this nice input formatter library.

I'm using the current react-native version ("react-native": "0.57.8") and I'm experiencing some kind o bug with both extensions: React Native Textinput Effects and MKTextField. In both cases I got the error in an Promise setNativeProps.

Here is the full error stack:
Possible Unhandled Promise Rejection (id: xx):
TypeError: _this2.getElement(...).setNativeProps is not a function
TypeError: _this2.getElement(...).setNativeProps is not a function
at blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:92066:33
at tryCallOne (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:22792:14)
at blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:22893:17
at blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:24215:21
at _callTimer (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:24104:9)
at _callImmediatesPass (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:24140:9)
at Object.callImmediates (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:24359:14)
at MessageQueue.__callImmediates (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:2431:16)
at blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:2268:18
at MessageQueue.__guard (blob:http://localhost:8081/b4f99887-436d-43cb-a41f-56416f70720c:2414:13)

This exception is the same in android and iOS. I have created a new project with react-native init newProjectTest, isolating just the needed libraries and using the original sample bellow. Seem like is something related to the new react-native version or something like this.

This is the code I am trying to make work:

import React from 'react'
import { StyleSheet, View } from 'react-native'
 
import { TextInputMask } from 'react-native-masked-text'
import { Kaede } from 'react-native-textinput-effects'
 
export default class App extends React.Component {
  constructor(props) {
    super(props)
 
    this.state = {
      birthday: ''
    }
  }
 
  render() {
    return (
      <View style={styles.container}>
        <TextInputMask
          refInput={(ref) => this.myDateText = ref;}
          // here we set the custom component and their props.
          customTextInput={Kaede}
          customTextInputProps={{
            style:{ width: '80%' },
            label:'Birthday'
          }}
 
          type={'datetime'}
          options={{
            format: 'DD-MM-YYYY HH:mm:ss'
          }}
 
          // don't forget: the value and state!
          onChangeText={birthday => this.setState({ birthday })}
          value={this.state.birthday} />
      </View>
    );
  }
}
 
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center'
    }
})

Any help will be appreciated, thks in advance!

[cassioseffrin]

_this2.getElement().setNativeProps({text:maskedText});

Since react-native 0.54 the TextInput.setNativeProps({text: ''}) no longer works, for while I just removed the line above in text-input-mask.js and the warning have disappeared.

Please verify if there are some side effects. May you can make a fix for the next version.

[bhrott]

Fixed at 1.10.0 =)