docs: 新增 Cascader form 用例

Author: 3lang3

packages/react-vant/src/components/cascader/README.md

@@ -16,6 +16,10 @@ import { Cascader } from 'react-vant';
 
 <code title="基础用法" src="./demo/base.tsx" />
 
+### Form 用法
+
+<code title="Form 用法" src="./demo/form.tsx" />
+
 ### 异步加载选项
 
 可以监听 `onChange` 事件并动态设置 `options`，实现异步加载选项。

packages/react-vant/src/components/cascader/demo/form.tsx

@@ -0,0 +1,41 @@
+import React from 'react'
+import { Cascader, Button, Input, Form, Toast, Space } from 'react-vant'
+import options from './options'
+
+export default () => {
+  const [form] = Form.useForm()
+  const onSumbit = async () => {
+    const values = await form.getFieldsValue()
+    console.log(values)
+    Toast.info(JSON.stringify(values))
+  }
+  const setValue = () => {
+    form.setFieldsValue({ area: ['330000', '330100', '330104'] })
+  }
+  return (
+    <Form form={form}>
+      <Form.Item name='area' label='地区' isLink>
+        <Cascader
+          popup={{ round: true }}
+          title='请选择所在地区'
+          options={options}
+        >
+          {(_, selectedRows, actions) => (
+            <Input
+              value={selectedRows.map(el => el.text).join(',')}
+              readOnly
+              placeholder='请选择所在地区'
+              onClick={() => actions.open()}
+            />
+          )}
+        </Cascader>
+      </Form.Item>
+      <Space block justify='center' style={{ marginTop: 20 }}>
+        <Button type='primary' onClick={onSumbit}>
+          提交
+        </Button>
+        <Button onClick={setValue}>设置默认值</Button>
+      </Space>
+    </Form>
+  )
+}