4663.0482d95b.chunk.js.map

{"version":3,"file":"static/js/4663.0482d95b.chunk.js","mappings":"gHAAA","sources":["../../packages/react-cascader/README.md"],"sourcesContent":["export default \"Cascader 级联选择\\n===\\n\\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-cascader/file/README.md)\\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-cascader.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-cascader)\\n[![npm version](https://img.shields.io/npm/v/@uiw/react-cascader.svg?label=@uiw/react-cascader)](https://npmjs.com/@uiw/react-cascader)\\n\\n级联选择框。v4.16.0中添加\\n\\n```jsx\\nimport { Cascader  } from 'uiw';\\n// or\\nimport Cascader from '@uiw/react-cascader';\\n```\\n\\n## 基础示例\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Cascader } from 'uiw';\\n\\nconst Demo = () => {\\n\\n  const options = [\\n    {\\n      label: '上海市',\\n      value: 1,\\n      children: [\\n        {\\n          label: '徐汇区',\\n          value: 4,\\n          children: [\\n            { label: '半淞园路街道', value: 6 },\\n            { label: '南京东路街道', value: 7 },\\n            { label: '外滩街道', value: 8 },\\n          ]\\n        },\\n      ]\\n    },\\n    {\\n      label: '北京市',\\n      value: 9,\\n      children: [\\n        {\\n          label: '崇文区',\\n          value: 12,\\n          children: [\\n            { label: '东花市街道', value: 13 },\\n            { label: '体育馆路街道', value: 14 },\\n            { label: '前门街道', value: 15 },\\n          ]\\n        },\\n      ]\\n    },\\n  ];\\n\\n  return (\\n    <div style={{ width: 200 }}>\\n      <Cascader allowClear={true} placeholder=\\\"请选择\\\" value={[1, 4, 7]} option={options} onChange={(value, seleteds) => console.log(value, seleteds)} />\\n    </div>\\n  )\\n};\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n### 在表单中使用\\n\\n在 [`<Form />`](#/components/form) 表单中应用 `<Cascader />` 组件。\\n\\n<!--rehype:bgWhite=true&codeSandbox=true&codePen=true&noScroll=true-->\\n```jsx\\nimport ReactDOM from 'react-dom';\\nimport { Form, Row, Col, Cascader, Button } from 'uiw';\\n\\nconst Demo = () => {\\nconst options = [\\n    {\\n      label: '上海市',\\n      value: 1,\\n      children: [\\n        {\\n          label: '徐汇区',\\n          value: 4,\\n          children: [\\n            { label: '半淞园路街道', value: 6 },\\n            { label: '南京东路街道', value: 7 },\\n            { label: '外滩街道', value: 8 },\\n          ]\\n        },\\n      ]\\n    },\\n    {\\n      label: '北京市',\\n      value: 9,\\n      children: [\\n        {\\n          label: '崇文区',\\n          value: 12,\\n          children: [\\n            { label: '东花市街道', value: 13 },\\n            { label: '体育馆路街道', value: 14 },\\n            { label: '前门街道', value: 15 },\\n          ]\\n        },\\n      ]\\n    },\\n  ];\\n\\n  return (\\n    <div>\\n      <Form\\n        onSubmitError={(error) => {\\n          if (error.filed) {\\n            return { ...error.filed };\\n          }\\n          return null;\\n        }}\\n        onSubmit={({initial, current}) => {\\n          const errorObj = {};\\n          if (!current.selectField) {\\n            errorObj.selectField = '默认需要选择内容，选择入内容';\\n          }\\n          if(Object.keys(errorObj).length > 0) {\\n            const err = new Error();\\n            err.filed = errorObj;\\n            Notify.error({ title: '提交失败！', description: '请确认提交表单是否正确！' });\\n            throw err;\\n          }\\n          Notify.success({\\n            title: '提交成功！',\\n            description: `表单提交成功，选择值为：${current.selectField}，将自动填充初始化值！`,\\n          });\\n        }}\\n        fields={{\\n          cascader: {\\n            initialValue:[1, 4, 7],\\n            children: (\\n              <Cascader\\n                allowClear={true}\\n                placeholder=\\\"请选择\\\"\\n                option={options}\\n                onChange={(value, seleteds) => console.log(value, seleteds)}\\n              />\\n            )\\n          },\\n        }}\\n      >\\n        {({ fields, state, canSubmit }) => {\\n          return (\\n            <div>\\n              <Row >\\n                <Col fixed style={{width:200}}>{fields.cascader}</Col>\\n              </Row>\\n              <Row>\\n                <Col fixed>\\n                  <Button disabled={!canSubmit()} type=\\\"primary\\\" htmlType=\\\"submit\\\">提交</Button>\\n                </Col>\\n              </Row>\\n              <Row>\\n                <Col>\\n                  <pre style={{ padding: 10, marginTop: 10 }}>\\n                    {JSON.stringify(state.current, null, 2)}\\n                  </pre>\\n                </Col>\\n              </Row>\\n            </div>\\n          )\\n        }}\\n      </Form>\\n    </div>\\n  );\\n}\\nReactDOM.render(<Demo />, _mount_);\\n```\\n\\n## Props\\n\\n| 参数 | 说明 | 类型 | 默认值 | 版本 |\\n| ---- | ---- | ---- | ---- | ---- |\\n| allowClear | 支持清除 | Boolean | `false` | - |\\n| placeholder | 选择框默认文字 | String | - | - |\\n| option | 选项菜单 | { value: String \\\\| Number, label: React.ReactNode, children: Array<String \\\\| Number>} | - | - |\\n| value | 指定当前选中的条目，多选时为一个数组 | String[] \\\\| Number[] | - | - |\\n| onChange | 选中选项调用此函数 | function( isSeleted, value, selectedOptions) | - | - |\\n\";"],"names":[],"sourceRoot":""}