どのような状態に `useEffect`フックにリンクの依存関係を反応させるのでしょうか？

felps321：

私はの「useState」フック作品をどのように反応するかは非常に良い想像してみてください。状態は、 - 特定のコンポーネントにマッピングされた値のリストであり、状態値のインデックスを要求しているuseStateコールのtheresのは、インデックス。コンポーネントレンダラencoutersを反応するとuseStateがアクセス権を持っているし、それは「現在の」コンポーネントの状態リストから、useStateコールインデックスによって状態値を返すので、それは、外部参照にそれを書き込みます。しかし、私は、どのように明らかに数値や文字列などのプレーンな値をある実際の状態に「useEffect」で識別して、リンクの依存関係リアクトん見当がつかない。それはどのように行われていますか？

import React from 'react'

function Component() {
  const [plainString, setPlainString] = React.useState('Hello')
  const [anotherPlainString, setAnotherPlainString] = React.useState('Good bye')

  // update `plainString` after mount
  React.useEffect(() => {
    setPlainString('Updated Hello')
  }, [])

  // callback get triggered after `plainString` update!
  // but how it links dependency to state if its just 'Hello' string?
  React.useEffect(
    () => {
      console.log(plainString) // "Updated Hello"
    },
    [plainString]
  )

  return <h1>plainString</h1>
}

Izium：

これは、依存関係の配列の変化の値が、彼らもステートフルである必要はありませんか、単にです。

useEffect(() => {

}, dependencyArray) // React loops over these values to check for changes

あなたは、ランダムな数字とかなり簡単にこれをテストすることができます

dependencyArray = [Math.random(), Math.random(), Math.random()]

これは非常に可能性の高い再レンダリングに異なる値を持つ配列を作成します。

それを取得初めてであれば[0.1, 0.2, 0.3]、それが得る次回[0.1, 0.2, 0]配列の値が同じではないので、それが再び効果をトリガーします。