Javascript 输入字段未更新。具有函数组件子级的父类

我正在学习react并尝试更新输入字段。我正在尝试建立一个层次结构。 我有一个类组件体和功能组件或子组件形式。我有一个处于主体状态的对象，并在表单中更新它。两者都在单独的文件中。调用函数并将状态设置为击键时，无法更新输入字段

class Body extends React.Component{
constructor(props){
        super(props)
        this.state = {
            users : [],
            user: {
                userName: '',
                setUserName : name => {this.setState({userName : name}); console.log(this.state.userName)},
                city: '',
                setCity : city => { this.state.city = city},
                cnic: '',
                setCNIC : cnic => { this.state.cnic = cnic},
                address: '',
                setAddress : address => { this.state.address = address}
            }
        }
    }
}

Form.js

const onChange = (event, updater) => {
    updater(event.target.value)
    //console.log(event.target.value)
}

function UserForm (props){
    //console.log(props) 
    return(
      <form>
            <label>
                Name:
                <input name="userName" value = {props.user.userName} onChange = {event => onChange(event, props.user.setUserName)}>
                </input>
            </label>
      </form>
           )
}

const onChange=（事件，更新程序）=>{
更新程序（event.target.value）
//console.log（event.target.value）
}
函数用户窗体（props）{
//控制台日志（道具）
返回(
姓名：
onChange（事件，props.user.setUserName）}>
)
}

Form.js的文件名中没有输入错误。函数组件为UserForm，文件名为Form.js。

---

我正在传递道具和更新值。但输入字段及其值没有变化。

看起来，您在

主体
组件初始状态的
用户
对象中定义的setter函数（即
setUserName（）
，
setCity（）
等）正在将状态更新应用到不同的“位置”在state对象中比您期望的要多

setState（）
函数应用相对于组件
state
对象根的状态更新

在您的情况下，这意味着调用带有参数的
setUserName
“bob”
，
主体
组件状态将更新为：

{ 
users :[], 
user : { /* existing object */ }, 
userName : "bob" /* Update applied relative to root of state object */
}

实现“嵌套状态更新”（即更新<代码>状态>用户用户名<代码> >，考虑以以下方式更新您的SETER函数：
setUserName : name => {
    this.setState({ 
        // Update existing user object with replacement
        user : { 
            ...this.state.user, // Clone existing user in state
            userName : name // Update the userName field in cloned user 
        }
    })
}

希望有帮助