mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-15 08:59:15 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity
3639697ba4
ant-design/components/tour/index.en-US.md
afc163 e027cbec1c
docs: format all markdown (#38629) 
* chore: add prettier-ignore in markdown demo

* docs: format markdown api table

* docs: format markdown api table
2022-11-17 17:31:26 +08:00

2.5 KiB
Raw Blame History

category group title cover demo
Components Data Display Tour https://gw.alipayobjects.com/zos/bmw-prod/cc3fcbfa-bf5b-4c8c-8a3d-c3f8388c75e8.svg
cols
2

A popup component for guiding users through a product. Available since 5.0.0.

When To Use

Use when you want to guide users through a product.

Examples

Basic Non-modal Placement _InternalPanelDoNotUseOrYouWillBeFired

API

Tour

Property Description Type Default Version
arrow Whether to show the arrow, including the configuration whether to point to the center of the elemen boolean|{ pointAtCenter: boolean} true
placement Position of the guide card relative to the target element left leftTop leftBottom right rightTop rightBottom top topLeft topRight bottom bottomLeft bottomRight bottom
onClose Callback function on shutdown Function -
mask Whether to enable masking boolean true
type Type, affects the background color and text color default primary default

TourStep

Property Description Type Default Version
target Get the element the guide card points to. Empty makes it show in center of screen () => HTMLElement HTMLElement -
arrow Whether to show the arrow, including the configuration whether to point to the center of the element boolean { pointAtCenter: boolean} true
cover Displayed pictures or videos ReactNode -
title title ReactNode -
description description ReactNode -
placement Position of the guide card relative to the target element left leftTop leftBottom right rightTop rightBottom top topLeft topRight bottom bottomLeft bottomRight bottom
onClose Callback function on shutdown Function -
mask Whether to enable masking, the default follows the mask property of Tour boolean true
type Type, affects the background color and text color default primary default
nextButtonProps Properties of the Next button { children: ReactNode; onClick: Function } -
prevButtonProps Properties of the previous button { children: ReactNode; onClick: Function } -