在ReactJs中，如何动态地将输入类型从"text“更改为"select"？

import React, { Component } from 'react';

class MyForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      inputType: 'text',
    };
  }

  handleChangeInputType = () => {
    this.setState({ inputType: 'select' });
  };

  render() {
    const { inputType } = this.state;

    return (
      <div>
        {inputType === 'text' ? (
          <input type="text" />
        ) : (
          <select>
            <option value="option1">Option 1</option>
            <option value="option2">Option 2</option>
            <option value="option3">Option 3</option>
          </select>
        )}

        <button onClick={this.handleChangeInputType}>Change Input Type</button>
      </div>
    );
  }
}

export default MyForm;