4

I have something like this:

<TextInput
  style={{height: 40, borderColor: 'gray', borderWidth: 1}}
  value={0}
  onChangeText={(input) => this.setState({ value: input })}
/>

However, the input box is always empty after load, any ideas?

Brian Law
  • 309
  • 3
  • 15

5 Answers5

16

TextInput component only accept strings. Looks like you have a integer there. Try changing that to a string. Heres a link to the doc.

Harshana
  • 443
  • 4
  • 9
  • Some best ways to convert a number to string: https://stackoverflow.com/questions/5765398/whats-the-best-way-to-convert-a-number-to-a-string-in-javascript – Rahul Saini May 01 '20 at 14:11
1

Its caused by an integer value. Do JSON.stringify(value)

Yinka
  • 1,424
  • 2
  • 13
  • 22
0

just change the value = {this.state.value} 

<TextInput
  style={{height: 40, borderColor: 'gray', borderWidth: 1}}
  value={this.state.value}
  onChangeText={(input) => this.setState({ value: input })}
/>
Shailesh Prajapati
  • 396
  • 3
  • 9
0

use toString()

<TextInput
  style={{height: 40, borderColor: 'gray', borderWidth: 1}}
  value={this.state.value.toString()}
  onChangeText={(input) => this.setState({ value: input })}
/>
Mitesh K
  • 530
  • 1
  • 5
  • 16
-1

Try this it works with me!

    const [_employee, setEmployee]=useState(
      {
        name: "name"
        salary: 0
      })

. . .

    <Input
      onChangeText={(salary) =>
        (salary = parseInt(salary)) & setEmployee({ ..._employee, salary })
      }
      value={JSON.stringify(_employee.salary)}
    />
Abdulah Alsharah
  • 1
  • 1
  • Welcome to stackoverflow and thank you for your effort. Unfortunately, your answer is not very helpful. Please explain your answer and avoid code-only answers. To learn more, see our tips on [writing great answers](https://stackoverflow.com/help/how-to-answer) – Luke_ Feb 19 '21 at 12:43