Как сохранить данные в исходный json файл? - PullRequest
Новая
       77

Как сохранить данные в исходный json файл?

0 голосов
/ 06 мая 2020 
    state = {one_book : []}


updateName = event =>{
        var newvalue = event.target.value
        const id = 1;
        let one_book = this.state.one_book;     // create the copy of state array
        one_book[1] = newvalue;                  //new value
        this.setState({ one_book }); 
        console.log(this.state.one_book)
    }

Здесь новое значение - это значение обновления, которое мы хотим изменить в файл json. Я хочу обновить имя книги с id = 1 с этим новым именем или весь объект в json файле с one_book .. изменения должны отражаться в исходном json файле 

I have to update this state into json file with the respective id.
Here is my json file
[
    {
            "id": 1,
            "bookname": "Physics",
            "price": 600,
            "author": "ABC",
            "pages": 567,
            "category" : "School Books"
    },
    {
            "id": 2,
            "bookname": "Let Us C",
            "price": 1300,
            "author": "XYZ",
            "pages": 1267,
            "category" : "Technical"  
    }
]

Ответы [ 2 ]

0 голосов
/ 06 мая 2020

Ваш лог c для копирования массива неверен. 

updateName = event =>{
        var newvalue = event.target.value
        const id = 1;

        let one_book = [...this.state.one_book];     // create the copy of state array
        one_book[1] = newvalue;                  //new value
        this.setState({ one_book }); 
        console.log(this.state.one_book)
    }
0 голосов
/ 06 мая 2020

Этот let one_book = this.state.one_book; не создает копию массива. Javascript массивы и объекты хранятся в переменных как ссылки.

Чтобы скопировать массив без случайной мутации, используйте деструктуризацию: 

let one_book = [...this.state.one_book];

Однако похоже, что вы пытаетесь получить id книги, используя индекс массива, как если бы это был id. Вместо этого вам нужно будет найти нужный объект по идентификатору. 

class Test extends React.Component {
 state = {one_book : [
    {
       "id": 1,
       "bookname": "Physics",
       "price": 600,
       "author": "ABC",
       "pages": 567,
       "category" : "School Books"
    },
    {
       "id": 2,
       "bookname": "Let Us C",
       "price": 1300,
       "author": "XYZ",
       "pages": 1267,
       "category" : "Technical"  
    }
]}


 updateName = event => {
   var newValue = event.target.value
   const id = 1;
   // Map over the array values
   let newBooks = this.state.one_book.map(book => {
      // If the id matches, update the book name
      if (book.id === id) {
       return {...book, bookname: newValue}
      }
      return book;
    })
  
    // Update the state with the new array
    this.setState({ one_book: newBooks }); 
  }
  
  render() {
    console.log(this.state.one_book)
    return <input onChange={this.updateName} />
  }
}

ReactDOM.render(<Test />, document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
...