react-steps-view

基于react、antd的步骤视图组件

支持自定义行内样式及class

参数说明

ReactStepsView

参数         | 说明                                                      | 类型              | 默认值
stepTitles     步骤条所有标题集合                                            String[]                --   
contents       步骤条每步内容展示的集合                                       Object[]                --
onFinish       所有步骤校验完成的回调函数,返回值为所有步骤中用户输入值的集合    callback(value)     --         
getValue       获取当前所有步骤中content内的用户输入项                       Fun                  -- 

content

参数        | 说明               | 类型    | 默认值
type          展示文档类型         String    null
label         文档的label          String    null
name          用户输入项存储的key   String    null
placeholder   表单控件默认提示语    String    null 
options       下拉列表下拉项参数    Array     null

调用示例

const stepTitles = ["step one","step two","step three"]
const contents = [
  {
    content:[
      {
        type:"Input",
        label:"test",
        name:"input",
        placeholder:"common input",
      },
      {
        type:"Password",
        label:"pwd",
        name:"pwd",
        placeholder:"password input",
      }
    ]
  },
  {
    content:[
      {
        type:"Input",
        label:"test1",
        name:"input2",
        placeholder:"common input",
      },
      {
        type:"Password",
        label:"pwd1",
        name:"pwd2",
        placeholder:"password input",
      }
    ]
  },
  {
    content:[
      {
        type:"Input",
        label:"test2",
        name:"input3",
        placeholder:"common input",
      },
      {
        type:"Password",
        label:"pwd2",
        name:"pwd3",
        placeholder:"password input",
      },
      {
        type:"Select",
        label:"Select",
        name:"select",
        placeholder:"common input",
        options:["select1","select2","select3","select4"]
      }
    ]
  },
];