メインコンテンツまでスキップ

Steps ステップ

ユーザーがプロセスに従ってタスクを完了するためのナビゲーションバー。

使用場面​

  • タスクが複雑である、または前後関係がある場合、一連のステップに分解してタスクを簡略化します。

コンポーネント例​

コンポーネント属性​

属性说明类型默认值
animation

アニメーションを有効にするかどうか

boolean

true

contentRender

コンテンツのカスタムレンダリング

(item: StepsDataSource, index: number)=> ReactNode

-
current

現在のステップ

number

1

dataSource

ステップデータ

StepsDataSource[]

[
{
  "title": "step1",
  "content": "冷蔵庫のドアを開ける"
},
{
  "title": "step2",
  "content": "象を冷蔵庫に入れる"
},
{
  "title": "step3",
  "content": "冷蔵庫のドアを閉じる"
}
]
direction

ステップ表示方向

'horizontal' | 'vertical'

'horizontal'

labelPlacement

コンテンツ配置方式

'horizontal' | 'vertical'

'vertical'

onClick

ステップクリック時にトリガーされるイベント

(index: number) => void

-
readOnly

読み取り専用モードかどうか

boolean

false

shape

ステップ表示形式

'circle' | 'arrow' | 'dot'

'circle'

この文書は機械翻訳により生成されています。翻訳により生じた齟齬や相違点は拘束力を持たず、コンプライアンスや執行目的において法的効力はありません。
© DingTalk (Singapore) Private Limited