How to implement data editing?

Question

React

Hello!
Perhaps the question is stupid, but I could not find a solution to the problem.
The task is to implement the possibility of CRUD operations for the application. C, R, D is already there.
It is necessary to implement the ability to edit and save changes on the server.
I load data from Firebase in the following format:

[
...
{
  id: "1",
  title: "some title",
  number: "1111",
  format: "some format",
  string: "some string"
  }
...
]

I used the "react-edit-inline" module, which allows you to edit the field when you click on it.
This is what the component looks like:

export default React.createClass({
  
  dataChanged(newdata) {
    
    this.setState({
      data: newdata
    });
  },
  
  render() {
    
    return (
      <div>
      <div
      <InlineEdit paramName="title" change={this.dataChanged} text={this.props.title} />
      <InlineEdit paramName="year"  change={this.dataChanged} text={this.props.nubmer} />
      <InlineEdit paramName="year"  change={this.dataChanged} text={this.props.format} />
      <InlineEdit paramName="stars" change={this.dataChanged} text={this.props.string} />
      </div>
    )
  }
})

Clearly, the "dataChanged" function overwrites the value in the selected field. I have an object property and its value, but I don't have the object itself that this property is bound to.
It is not clear how to implement data rewriting based on these data.

Answer 1

Good afternoon.
Where did you get this.props.title then, for example?
After editing the field (fields), you send a request to the server with the data from the form (by clicking on the button in the parent component, or what?). Use the id that comes to you initially (judging by the data format in your question) and is probably located in this.props.id