React-native-windows: onChangeText callback for TextInput gets called on render

[josephan]

There is a bug with React Native Windows where the callback, onChangeText, for TextInput gets called when the component gets rendered.

For example I added a console.log() to the callback.
Here is a demo:

Windows:

• I refresh the app and you can see the console.log() on render without any input
  

iOS:

• I refresh the app and there is no console.log() on render
• console.log() only shows when I change the input
  

The code:

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  TextInput,
  View
} from 'react-native';

export default class TextInputTest extends Component {
  constructor(props) {
    super(props);
    this.state = { text: 'placeholder...' }
  }

  render() {
    let os = Platform.OS
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          You are using an {os.toUpperCase()} device.
        </Text>
        <TextInput 
          style={styles.input}
          onChangeText={(text) => {this.setState({text}); console.log('you should not see this on render')}}
          value={this.state.text}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  input: {
    borderColor: 'lightgray',
    borderWidth: 1,
    height: 40,
    textAlign: 'center',
    margin: 10,
  }
});

The link to the repo in the demo is here: https://github.com/josephan/rn-text-input-test/blob/master/App.js

[victorileaf]

@rozele Any updates on this issue? I am calling store update on onChangeText. Its a large grid view with input fields. Since the onChangeTextmethod gets called in the render .. its calling recursive re renders in the page.
Is there any hacks ?

How can i make sure onChangeTexttext will only work when user changes data and not on render?

[victorileaf]

@rozele is this commit merged to the master?
i'm still able to reproduce this issue in "react-native-windows": "^0.50.0-rc.2"

[MuhammedMahdy]

i think onTextChange already didn't sent event to render method , but when call this.setState all component reloaded