当前位置: 首页 > news >正文

【Ant.design pro】 formRef 用法

文章目录

  • 一、导入与定义
  • 二、使用方法

一、导入与定义

import React, {useRef} from "react";const formRef = useRef<ProFormInstance>();

在form表单内定义 formRef={formRef}

 <StepsFormactionRef={Ref}formRef={formRef}onFinish={async (params) =>{console.log(params)}}>。。。
</StepsForm>

二、使用方法

1.获取方法:
const pay_amount = formRef?.current?.getFieldValue(“pay_amount”)
2.添加方法:
formRef?.current?.setFieldsValue({recevited_amount:pay_amount-(no_pay_amount?no_pay_amount:0)})

这样可以给recevited_amountProFormMoney 输入框添加联动值

<ProFormMoney label={"缴款金额"} name={"pay_amount"} />
<ProFormMoney label={"欠款"} name={"no_pay_amount"} />
<ProFormDependency name={['no_pay_amount']}>{({ no_pay_amount }) => {const pay_amount = formRef?.current?.getFieldValue("pay_amount")formRef?.current?.setFieldsValue({recevited_amount:pay_amount--(no_pay_amount?no_pay_amount:0)})}}
</ProFormDependency>
<ProFormMoney label={"实际到账金额"} name={"recevited_amount"} disabled extra={(<a style={{color:"red"}}>实际到账金额=缴款金额-返款-欠款</a>)}/>

http://www.mrgr.cn/news/68639.html

相关文章:

  • 基于SSM(Spring + Spring MVC + MyBatis)框架的汽车租赁共享平台系统
  • 【LeetCode】【算法】300. 最长递增子序列
  • npm镜像的常用操作
  • [JAVAEE] 网络基础
  • github加速下载zip
  • Pytorch如何精准记录函数运行时间
  • C++ 二分法
  • 中小跨境卖家如何选择物流?
  • 如何使用 Python 语言的正则表达式进行网页数据的爬取?
  • 算法 -排序 -插入,选择
  • 2024外贸独立站指南:3个提高转化的问题所在!
  • 反反爬-课上实验
  • LLM | 论文精读 | CVPR | 基于问题驱动图像描述的视觉问答增强引言
  • 【专题】2024年全球生物医药交易报告汇总PDF洞察(附原数据表)
  • 企业高效运转秘诀,揭秘工单系统双重价值
  • 【vue2.7.16系列】手把手教你搭建后台系统__刷新问题(17)
  • SpringMVC学习记录(五)之SpringMVC其他扩展
  • 关于我、重生到500年前凭借C语言改变世界科技vlog.16——万字详解指针概念及技巧
  • 44.第二阶段x86游戏实战2-C++HOOK提取游戏lua
  • LeetCode:485.最大连续1的个数——简单题简单做
  • Python matplotlib库 grid()网格线函数讲解
  • echarts设置tooltip宽高
  • AI和大模型技术在网络脆弱性扫描领域的最新进展与未来发展趋势
  • Docker配置及简单应用
  • 揭秘集装箱箱号自动识别原理,箱号识别算法
  • 智慧城市路面垃圾识别系统产品介绍方案