在Wordpress Gutenberg边栏中子组件向父组件传递状态

import React, { useState } from 'react';

const ChildComponent = () => {
  const [status, setStatus] = useState(false);

  const handleClick = () => {
    setStatus(!status);
    // 可以在这里执行其他操作或更新其他状态
  };

  return (
    <div>
      <button onClick={handleClick}>Toggle Status</button>
    </div>
  );
};

export default ChildComponent;

import React from 'react';
import ChildComponent from './ChildComponent';

const ParentComponent = () => {
  const handleStatusChange = (status) => {
    // 在这里可以处理子组件传递过来的状态
    console.log('Received status from child component:', status);
  };

  return (
    <div>
      <h1>Parent Component</h1>
      <ChildComponent onStatusChange={handleStatusChange} />
    </div>
  );
};

export default ParentComponent;