antd-mobile Step组件 添加点击事件
时间: 2023-08-18 22:33:28 浏览: 139
ant-design-mobile-rn-3.0.0.zip
要为 antd-mobile 的 Step 组件添加点击事件,你可以使用 Step 组件的 `onChange` 属性。在该属性中传入一个回调函数,该函数会在每次点击 Step 组件时触发。回调函数的参数 `current` 表示当前被点击的 Step 组件的索引值(从 0 开始计数)。
下面是一个示例代码:
```jsx
import { Steps } from 'antd-mobile';
function MySteps(props) {
const { steps } = props;
const handleStepClick = (current) => {
console.log(`Step ${current} clicked`);
};
return (
<Steps
current={0}
onChange={handleStepClick}
>
{steps.map((step, index) => (
<Steps.Step key={index} title={step.title} />
))}
</Steps>
);
}
```
在上述代码中,我们定义了一个名为 `handleStepClick` 的回调函数,并将其传入 Step 组件的 `onChange` 属性中。在回调函数中,我们会打印出被点击的 Step 组件的索引值。
你可以根据实际的业务需求,修改回调函数的实现方式。例如,你可以在回调函数中修改 Step 组件的状态,或者触发其他的操作。
阅读全文