如何在React中将<td></td>转换为<input /> onClick

import React, { useState } from 'react';

function MyComponent() {
  const [tdContent, setTdContent] = useState('<td></td>');

  // ...

  return (
    <div>
      {/* Render the tdContent as a td element */}
      <table>
        <tbody>
          <tr>
            <td dangerouslySetInnerHTML={{ __html: tdContent }}></td>
          </tr>
        </tbody>
      </table>

      {/* Render a button to convert the td element to an input element */}
      <button onClick={() => setTdContent('<input />')}>Convert to Input</button>
    </div>
  );
}

export default MyComponent;