我无法更改 TextInput 的值

Question

这是代码：

import { View, TextInput } from 'react-native';
import { styles } from './styles';
import { useState } from 'react';
import { getData } from '../../controllers/storages';

export default function Profile() {
    const [name, setName] = useState('');

    getData('user').then((res)=>{
        let a = JSON.parse(res)
        setName(a.name)
        })


  return (
    <View  style={styles.contender}>
        <View>
            <TextInput style={styles.email}        
                onChangeText={newText => setName(newText)}
                defaultValue={name}   
                placeholder="Enter username"           
            />
        </View>
    </View>
  );
}

我从服务器获取值 name，它在输入中打印出来，工作正常，但是当我尝试修改该值时，它会很快恢复到原始值。我一直在阅读线程，发现最相似的是：

他们把这个 link https://reactnative.dev/docs/handling-text-input 这很有趣，但它在我的情况下不起作用，我相信这是因为他们从一开始就使用空字符串。我无法理解的其他答案，当他们提到 this.state 和对象信息时我迷路了。

我也尝试将属性 value 更改为 defaultValue，如您所见，但仍然无效。

我只想打印来自服务器的输入中的值，并且能够更改它并将其放入同一个 useState 变量（名称）

Answer 1

每次更改名称的状态时，您的组件都是 re-rendered，因此会调用函数 getData。

如果您只想在第一次安装组件时调用服务器，您应该使用 useEffect。

import { View, TextInput } from 'react-native';
import { styles } from './styles';
import { useState,useEffect } from 'react';
import { getData } from '../../controllers/storages';

export default function Profile() {
    const [name, setName] = useState('');

    useEffect(getData('user').then((res)=>{
        let a = JSON.parse(res)
        setName(a.name)
        }),[]);
    


  return (
    <View  style={styles.contender}>
        <View>
            <TextInput style={styles.email}        
                onChangeText={newText => setName(newText)}
                defaultValue={name}   
                placeholder="Enter username"           
            />
        </View>
    </View>
  );
}

我无法更改 TextInput 的值

I can't change value of a TextInput

react-native

expo