umi react 的面包屑怎么使用单击事件

在React中使用面包屑（Breadcrumb）的单击事件，可以通过以下步骤完成：

创建一个面包屑组件（Breadcrumb）：

import React from 'react';

const Breadcrumb = ({ items, onItemClick }) => {
  return (
    <ul>
      {items.map((item, index) => (
        <li key={index} onClick={() => onItemClick(item)}>
          {item}
        </li>
      ))}
    </ul>
  );
};

export default Breadcrumb;

在使用面包屑的父组件中，定义一个处理单击事件的函数：

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

const App = () => {
  const handleItemClick = (item) => {
    console.log(`Clicked on ${item}`);
  };

  const breadcrumbItems = ['Home', 'Category', 'Subcategory'];

  return (
    <div>
      <h1>My App</h1>
      <Breadcrumb items={breadcrumbItems} onItemClick={handleItemClick} />
    </div>
  );
};

export default App;

在上述代码中，handleItemClick函数会在面包屑中的每个列表项被单击时被调用，并打印出相应的项。

渲染父组件（App）：

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));

现在，当你在浏览器中运行该应用时，每次单击面包屑中的列表项时，控制台会输出相应项的名称