Невозможно создать свойство 'ключ' для строки

Question

Я использую Firebase и реагирую. Я сопоставляю базу данных, пытаясь назначить ключ каждому элементу. Я делал это раньше и у меня не было проблем, но по какой-то причине React это не нравится. Я использую componentDidMount для синхронизации моего приложения с firebase, и именно здесь я беру каждый элемент и уникальный ключ из firebase. Кроме того, console.log дает мне нужный ключ.

 componentDidMount() {
       this.todosRef.on('child_added', snapshot => {
         const todo = snapshot.val();
         todo.key = snapshot.key;
         console.log(todo.key);
         this.setState({ todos: this.state.todos.concat( todo ) });
       });
     }

но когда я сопоставляю массив и назначаю ключ, он выдает ошибку: Cannot create property 'key' on string '

Вот как я отображаю:

const listOfTodos = this.state.todos.map( (todo) => {
    return <li key={todo.key}>{todo}</li>
});

Answer 1

Я считаю, что у вас есть неизменный объект, который вы пытаетесь изменить.

https://firebase.google.com/docs/reference/js/firebase.database.DataSnapshot

DataSnapshot - это эффективно сгенерированная, неизменная копия данных в местоположении базы данных. Он не может быть изменен и никогда не изменится (для изменения данных вы всегда вызываете метод set () непосредственно в Reference).

Попытайтесь поместить ваш todo и ключ в новый объект, подобный этому:

const todo = { key: snapshot.key, value: snapshot.val() }