如何在Modal组件中为文本呈现动态变量？

// 父组件
import React, { useState } from 'react';
import Modal from './Modal';

const ParentComponent = () => {
  const [dynamicVariable, setDynamicVariable] = useState('');

  const handleButtonClick = () => {
    // 模拟获取动态变量的值
    const variableValue = '动态变量的值';
    setDynamicVariable(variableValue);
  };

  return (
    <div>
      <button onClick={handleButtonClick}>点击获取动态变量</button>
      <Modal dynamicVariable={dynamicVariable} />
    </div>
  );
};

export default ParentComponent;

// Modal组件
import React from 'react';

const Modal = ({ dynamicVariable }) => {
  return (
    <div>
      <h1>Modal组件</h1>
      <p>这是一个文本，其中包含动态变量：{dynamicVariable}</p>
    </div>
  );
};

export default Modal;