高階組件中添加事件功能的示例

　　以下是一個簡單的高階組件示例，用于在傳入組件中添加鼠標(biāo)移入事件的功能：　　

import React from 'react';

function withMouseHover(Component) {
  return class extends React.Component {
    handleMouseHover = () => {
      console.log('Mouse hovered');
    };

    render() {
      return (
        <div onMouseEnter={this.handleMouseHover}>
          <Component {...this.props} />
        </div>
      );
    }
  };
}

function MyComponent(props) {
  return <div>My Component</div>;
}

const MyComponentWithMouseHover = withMouseHover(MyComponent);

// 使用高階組件包裝后的組件
<MyComponentWithMouseHover />;

　　在上述示例中，withMouseHover 是一個高階組件，它接受一個組件作為參數(shù)，并返回一個新的包裝組件。在返回的包裝組件中，添加了鼠標(biāo)移入事件的處理邏輯，并將傳入的組件作為子組件渲染。

　　通過這種方式，我們可以實(shí)現(xiàn)在多個組件中添加鼠標(biāo)移入事件的功能，而不需要在每個組件中重復(fù)編寫相同的邏輯。

　　需要注意的是，高階組件只是一種模式和約定，并不是 React API 的一部分。因此，可以根據(jù)實(shí)際需要自定義和設(shè)計(jì)高階組件，根據(jù)不同的場景和需求來實(shí)現(xiàn)組件的復(fù)用和增強(qiáng)。