React Hook useEffect缺少依赖项:“注释”,如何解决?

时间:2019-12-03 06:37:57

标签: javascript reactjs react-native graphql

我在这里使用了react hook,我一直收到此错误。

  

React Hook useEffect缺少依赖项:“注释”。要么包括   它或删除依赖项数组。您还可以进行功能更新   如果只需要在'setNotes'调用中使用'notes',则使用'setNotes(n => ...)'   反应钩/详尽的下降

useEffect(() => {
    getNotes();
    const createNoteListner = API.graphql(
      graphqlOperation(onCreateNote)
    ).subscribe({
      next: noteData => {
        const newNote = noteData.value.data.onCreateNote;
        setNotes(prevNotes => {
          const oldnotes = prevNotes.filter(note => note.id !== newNote.id);
          const updatedNotes = [...oldnotes, newNote];
          return updatedNotes;
        });
        setNote("");
      }
    });
    const deleteNoteListner = API.graphql(
      graphqlOperation(onDeleteNote)
    ).subscribe({
      next: noteData => {
        const deleteNote = noteData.value.data.onDeleteNote;
        setNotes(prevNotes => {
          const updatedNotes = prevNotes.filter(
            note => note.id !== deleteNote.id
          );
          return updatedNotes;
        });
      }
    });
    const updateNoteListner = API.graphql(
      graphqlOperation(onUpdateNote)
    ).subscribe({
      next: noteData => {
        const updatedNote = noteData.value.data.onUpdateNote;
        setNotes(prevNotes => {
          const index = prevNotes.findIndex(note => note.id === updateNote.id);

          const updatedNotes = [
            ...notes.slice(0, index),
            updatedNote,
            ...notes.slice(index + 1)
          ];

          return updatedNotes;
        });
        setNote("");
        setId("");
      }
    });
    return () => {
      createNoteListner.unsubscribe();
      deleteNoteListner.unsubscribe();
      updateNoteListner.unsubscribe();
    };
  }, []);

2 个答案:

答案 0 :(得分:2)

在代码的结尾,有一个}, [])

如果您想通过更改某些道具或状态来更新useEffect,则可以在该数组中提及它,例如}, [props.sth]),并且如果您希望每次useEffect通话时都需要移除空数组,您的代码将以})

结尾

答案 1 :(得分:0)

您需要在效果的依存关系中添加notes 如果不是,则更改将不会反映出来。

...

  return() =>{
      createNoteListner.unsubscribe();
      deleteNoteListner.unsubscribe();
      updateNoteListner.unsubscribe();
  }
}, [notes])