react使用antd中Form内联组件与Form表单默认赋值

本文介绍了在React项目中使用Ant Design(antd)的Form组件时,如何为内联的Input组件赋予初始值。通过官方文档的示例,展示了一组Input组件的初始值设置方法,并解决了赋值后导致表单验证失效的问题。关键在于理解并正确处理name属性中的多个名字,以确保基础设置的正确性。
摘要由CSDN通过智能技术生成

先写思路:这里假设我写了两个Input组件,他们是一组,都在Form表单里面。然后我在通过initialValues给他们赋初始值。

  • 一组Input组件的解决方案:

一组Input组件,这里直接转到官网教程:
https://ant.design/components/form-cn/#header
看官网的代码直接套用即可

在这里插入图片描述

  • 给一组Input组件赋初始值解决方案:

我这里使用了官网此处的方法赋值完后,发现表单验证是无法通过了,就过一夜的苦寻答案后,解决如下(在initialValues里面赋值,但是写法和一般的写法有些不同,因为一组组件的话那个name属性里面是有两个名字的嘛,这就是困扰了我好久的问题。。基础不牢、地动山摇咳咳):

const initialValues = {
   
        config: 
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值