指南
是一个React组件,用于呈现用户指南在模态中。该指南由几页组成,用户可以逐一浏览。当模式关闭或用户单击时,指南完成完成在指南的最后一页。
函数MyTutorial(){const[isOpen,setIsOpen]=使用状态(true);if(!is打开){返回null;}返回(<指南onFinish={()=>setIsOpen(false)}页数={[{content:<p>欢迎来到ACME商店</p> ,},{图像:<img src=“https://acmestore.com/add-to-cart.png" />,内容:(<p>单击<i>添加到购物车</i>购买产品。</p>),},] }/>);}
组件接受以下道具:
要添加到模态的自定义类。
此属性用作模态的可访问性标签。出于可访问性的原因,它是必需的。
使用此选项自定义完成按钮显示在指南的末尾。
指南完成时调用的函数。当模式关闭或用户单击时,指南完成完成在指南的最后一页。
- 类型:
(事件?:KeyboardEvent<HTMLDivElement>|SyntheticEvent)=>void
- 必需:是
描述指南中每个页面的对象列表。每个对象必须包含一个'内容'
属性,可以选择包含'图像'
属性。
- 类型:
{content:反应节点;图像?:反应节点;}[]
- 必需:否
- 违约:
[]