如何在Typescript和React.js中解析带有随机字段的JSON

import React from 'react';

{
  "name": "John",
  "age": 25,
  "randomField1": "value1",
  "randomField2": "value2",
  ...
}

interface MyData {
  name: string;
  age: number;
  [key: string]: string | number;
}

const JsonParser: React.FC<{ json: string }> = ({ json }) => {
  const data: MyData = JSON.parse(json);

  return (
    <div>
      <h2>Name: {data.name}</h2>
      <h2>Age: {data.age}</h2>
      <h2>Random Fields:</h2>
      <ul>
        {Object.keys(data).map((key) => (
          <li key={key}>
            {key}: {data[key]}
          </li>
        ))}
      </ul>
    </div>
  );
};

const App: React.FC = () => {
  const json = `{
    "name": "John",
    "age": 25,
    "randomField1": "value1",
    "randomField2": "value2"
  }`;

  return (
    <div>
      <h1>JSON Parser</h1>
      <JsonParser json={json} />
    </div>
  );
};

ReactDOM.render(<App />, document.getElementById('root'));