为什么会出现错误“组件正在更改隐藏为不受控制的类型的受控输入”？

Question

我遇到错误“组件正在更改隐藏为不受控制的类型的受控输入”的问题。当我阅读这是未设置文本字段的默认值的问题。但是在我的情况下，它已设置，但错误仍然出现，并且状态part1，part2，operator未定义。

我现在知道为什么了，有人可以帮忙吗？

ConditionComponent类扩展了React.Component {

constructor(props){
    super(props);
    this.state={
        operator: "",
        part1: "",
        part2: "",
        arr: this.props.arr
    }
}

componentWillReceiveProps(nextProps) {
    if (nextProps.arr !== this.state.arr) {
        this.setState({
            arr: nextProps.arr, part1: this.state.arr[this.props.index].part1,
            part2: this.state.arr[this.props.index].part2,
            operator: this.state.arr[this.props.index].operator
        }, () => console.log(this.state.part1, this.state.part2, this.state.operator))
    }
}

handleChanges = (e, part) => {
    if (part === "part1") {
        this.setState({part1: e.target.value}, () => this.props.handleChange(this.state.part1, part))
    }
    if (part === "part2") {
        this.setState({part2: e.target.value}, () => this.props.handleChange(this.state.part2, part))
    }
    if (part === "operator") {
        this.setState({operator: e.target.value}, () => this.props.handleChange(this.state.operator, part))
    }
};

render() {

    return (
        <ListItem>
            <TextField
                fullWidth
                margin="auto"
                defaultValue={this.state.part1}
                onChange={e => {
                    this.handleChanges(e, "part1")
                }}
            />
            <Select value={this.state.operator}
                    variant="outlined"
                    onChange={e => this.handleChanges(e, "operator")}
                    inputProps={{name: "data"}}>
                {this.props.operators.map((val, i) => {
                    return (<MenuItem value={val} key={i}>{val}</MenuItem>)
                })}
            </Select>
            <TextField
                fullWidth
                margin="auto"
                defaultValue={this.state.part2}
                onChange={e => this.handleChanges(e, "part2")}
            />
        </ListItem>
    );
}

}