Блог

помогите мне, пожалуйста. Как будет сохраняться изменение в таблице материалов (реагировать), будет использоваться localstorage или setstate. Как это сделать? Я не нашел ничего подобного на YouTube, поэтому буду очень благодарен, так как я только начинаю разбираться с React и еще не ясно, как это реализовать, но я действительно хочу использовать material-ui

 import React, {useState} from 'react'; import './App.css'; import MaterialTable from 'material-table';  const empList = [  {id:1, name: "Alisa", email: 'alisa@gmail.com', phone: 375331111111, city: "Piter"},  {id:2, name: "Anna", email: 'anna@gmail.com', phone: 375332222222, city: "Piter"},  {id:3, name: "Anastasia", email: 'anastasia@gmail.com', phone: 375333333333, city: "Piter"},  {id:4, name: "Alexander", email: 'alexander@gmail.com', phone: 375334444444, city: "Piter"}, ] function App() {   const [data, setdata] = useState(empList)  const columns = [  {title: "ID", field: "id", },  {title: "Name", field: "name", },  {title: "Email", field: "email", },  {title: "Phone number", field: "phone", },  {title: "City", field: "city", },  ]   return (  lt;div className="App"gt;  lt;h1 align = "center"gt;React-applt;/h1gt;  lt;h4 align = "center"gt;Material Table With CRUD operationlt;/h4gt;  lt;MaterialTable  title = "Employee Data"  data = {data}  columns = {columns}  editable = {{  onRowAdd: (newRow)=gt;new Promise((resolve, reject)=gt;{  const updatedRows=[...data, newRow]  setTimeout(()=gt;{  setdata(updatedRows)  resolve()  },2000)  }),  onRowDelete:selectedRow=gt;new Promise((resolve, reject) =gt;{  const index = selectedRow.tableData.id;  const updatedRows= [...data]  updatedRows.splice(index, 1)  setTimeout(()=gt;{  setdata(updatedRows)  resolve()  },2000)  }),  onRowUpdate:(updatedRow, oldRow)=gt;new Promise((resolve, reject)=gt;{  const index = oldRow.tableData.id;  const updatedRows = [...data]  updatedRows[index]=updatedRow  setTimeout(()=gt;{  setdata(updatedRows)  resolve()  },2000)  })  }}  options={{  actionsColumnIndex:-1, addRowPosition:"first"  }}  /gt;  lt;/divgt;  ); }  export default App;