JavaScript - React コンテキストが再レンダリングを引き起こさない

この状況には非常に当惑しています。コンテキスト内に 2 つのメソッドがあります。1 つはコンシューマで再レンダリングを正常に実行し、もう 1 つは再レンダリングを実行しません。

これは正常に動作します:

this.setPage = (tag) => {
            this.setState(state => {

                for (let item of tag) {
                    if (!state.tags.includes(item)) {
                        state.tags.push(item)
                    }
                }

                state.currentTags = tag
                return tag
            })
        }

しかし、これはそうではありません:

this.popPage = (tag) => {
            this.setState(state => {                
                if (state.tags.includes(tag)) {
                    if (state.tags.length == 1)
                        return

                    state.tags.pop()
                    state.currentTags = [state.tags[state.tags.length - 1]]

                    return tag
                }
            })
        }

これらは基本的に、項目を配列にプッシュおよびポップするだけです。コードは実行され、正常に機能しますが、2 番目の関数のコンシューマには更新がありません

<Page.Consumer>
   {page => /*Components go here*/}
</Page.Consumer>

まず、(タグではなく) 状態を返す必要があります。タグが何のためにあるのか正確にはわかりませんが、次の状態がタグとして設定されることは私にとってはあまり意味がありません。 2 番目のブロックではさらに悪化します。状態が以下の場合満たされていない場合は、次の状態として何も返しません。

1

それが違いを生むかどうかはわかりませんが、私は関数の戻り値を使用していません。私の知る限り、状態オブジェクトが変更された場合、コンシューマーは再レンダリングする必要があります。教えていただいた方法を確認しましたが、やはり同じでした。

user5939597

2020 年 9 月 3 日 20:06