сравнить первое состояние с последним

Question

Я пытаюсь сделать страницу редактирования.Я обновляю состояние для любых внесенных изменений.Я хочу сравнить исходное состояние с последним состоянием при последнем сохранении.но я не могу контролировать первое состояние.

export default class extends Component {

    constructor(props){
        super(props);
        this.changeDetails = this.changeDetails.bind(this);
        this.state = {
            driver: this.props.driver
        }
    }

    changeDetails = value => {
        this.setState({
            driver:value
        })
    }

    onRegister = () => {
        //I want to make a comparison here.

    }


    render() { 
        const {driver} = this.state
        return (
            <div>
               <EditView driver={driver} changeDetails={this.changeDetails}/>
            </div>
        );
    }
}

EditView.js

 export default class extends Component {
      render() {
        const { driver} = this.props;

        const changeDetails = event => {
            driver['fname] = event.target.value;
            this.props.changeDetails(driver);
          };

        return (
          <div>
            <Input
                value={driver.fname}
                onChange={event => changeDetails(event)}
                />
          </div>
        );
      }
    }

Answer 1

Не изменяйте сам драйвер напрямую. Используйте что-то вроде этого:

const changeDetails = event =>
    this.props.changeDetails( { ...driver, fname: event.target.value } );