从父级到子级的状态更改不会反映到React钩子中的TextField

import React, { useEffect, useState } from 'react';

const ChildComponent = ({ parentState }) => {
  const [childState, setChildState] = useState('');

  useEffect(() => {
    setChildState(parentState);
  }, [parentState]);

  return (
    <div>
      <TextField value={childState} />
    </div>
  );
};

import React, { useState } from 'react';

const ParentComponent = () => {
  const [parentState, setParentState] = useState('');

  const handleStateChange = (newValue) => {
    setParentState(newValue);
  };

  return (
    <div>
      <ChildComponent parentState={parentState} />
      <button onClick={() => handleStateChange('New Value')}>Change State</button>
    </div>
  );
};

const ChildComponent = ({ parentState }) => {
  return (
    <div>
      <TextField value={parentState} />
    </div>
  );
};