| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- import { useRef } from "react";
- import { ProForm, ProFormSelect } from "@ant-design/pro-components";
- import type { ProFormInstance } from "@ant-design/pro-components";
- import { Button } from "antd";
- interface IFormData {
- sv: number;
- }
- const Widget = () => {
- const formRef = useRef<ProFormInstance | undefined>(undefined);
- const svCur = 5;
- const onWhat = () => {
- const it = formRef.current?.getFieldValue("sv") || [];
- console.log(it);
- if (!it.includes(svCur)) {
- it.push(svCur);
- }
- formRef.current?.setFieldsValue({ sv: it });
- };
- const onReset = () => {
- formRef.current?.resetFields();
- };
- return (
- <ProForm<IFormData>
- name="demo"
- formRef={formRef}
- submitter={{
- render: (_props, doms) => {
- return [
- ...doms,
- <Button.Group key="refs" style={{ display: "block" }}>
- <Button htmlType="button" onClick={onWhat} key="what">
- What?
- </Button>
- <Button htmlType="button" onClick={onReset} key="reset">
- Reset
- </Button>
- </Button.Group>,
- ];
- },
- }}
- >
- <ProFormSelect
- width="md"
- name="sv"
- mode="multiple"
- allowClear
- dependencies={["sv"]}
- options={Array.from(Array(10).keys()).map((x) => {
- return { value: x, label: `V${x}`, disabled: x === svCur };
- })}
- />
- </ProForm>
- );
- };
- export default Widget;
|