如何使用react钩子在react本机中使用TextInput更改对象数组的特定字符串？

import React, { useState } from 'react';

function App() {
  const [data, setData] = useState([
    { id: 1, text: 'Hello' },
    { id: 2, text: 'World' },
    { id: 3, text: 'React' }
  ]);

  // 其他代码...

  return (
    // JSX代码...
  );
}

function handleTextChange(id, newText) {
  setData(prevData => {
    return prevData.map(item => {
      if (item.id === id) {
        return { ...item, text: newText };
      }
      return item;
    });
  });
}

function App() {
  // 状态变量和处理文本更改的函数...

  return (
    <div>
      {data.map(item => (
        <TextInput
          key={item.id}
          value={item.text}
          onChange={e => handleTextChange(item.id, e.target.value)}
        />
      ))}
    </div>
  );
}