实现界面

     <Col span={12}>
          <ProForm.Item
            name="name"
            label="推荐用户"
          >
            <AutoComplete
              className="pro-field pro-field-md"
              placeholder="请输入用户名"
              options={NameArr}
              onSearch={debounce(searchUser, 500)}
              onSelect={onSelect}
            />
          </ProForm.Item>
        </Col>

 //查询用户
  const searchUser = async (searchText: string) => {
    dispatch<UserAction>({
      type: 'user/check',
      payload: { keyword: searchText },
    });
  }
  const onSelect = (data: string) => {
    const nameitem = checkarr?.find(({ id }) => id === data)
    if (!nameitem) return
    const { name } = nameitem
    formRef?.current?.setFieldsValue({
      name
    });
    setparentUserId({data})
  };
  useEffect(() => {
    setNameArr((checkarr || []).map(({ id, name }) => ({
      value:id,
      label: `${name}`
    })))
  }, [checkarr])

formRef?.current?.setFieldsValue({name  });目的为了设置选择后的value，而不是展示选择的id