#yyds干货盘点 【React工作记录三十】react中form表单编辑的时候回显无法回显

简介: #yyds干货盘点 【React工作记录三十】react中form表单编辑的时候回显无法回显

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷


导语

求助同事 编辑的时候无法进行回显操作


image.png


编辑


<Form.Item label="机构名称:">
{getFieldDecorator('name', {
   initialValue:
   type === 'update'
 ? { code: lecturerOrganizationEntity.companyLibraryCode }
 : {},
  rules: [{ required: true, message: '请填写机构名称' }],
})(
<BaseCompanyLibrary disabled={disabled} onChange={this.handleChangeCompany} />
)}
 </Form.Item>




解决方法

<Form
              style={{
                display: editStep === 0 && !successModal ? 'block' : 'none',
                marginTop: '50px',
              }}
              {...formItemLayoutSmall}
              id={`${id}base-info`}
              key={JSON.stringify(lecturerOrganizationEntity)}
            >



总结

绑定key值可以进行数据渲染 问题可解









相关文章
|
5月前
|
前端开发 UED 开发者
React 19 Actions:表单处理从未如此优雅
React 19 Actions:表单处理从未如此优雅
265 84
|
移动开发 前端开发 JavaScript
React 表单与事件
10月更文挑战第10天
169 1
|
前端开发 JavaScript 数据安全/隐私保护
深入探索研究React表单
【10月更文挑战第6天】
164 57
|
11月前
|
存储 前端开发 JavaScript
React 表单输入组件 Input:常见问题、易错点及解决方案
本文介绍了在 React 中使用表单输入组件 `Input` 的基础概念,包括受控组件与非受控组件的区别及其优势。通过具体代码案例,详细探讨了创建受控组件、处理多个输入字段、输入验证和格式化的方法,并指出了常见易错点及避免方法,旨在提升表单的健壮性和用户体验。
296 4
|
前端开发 JavaScript
React 表单处理技巧
【10月更文挑战第24天】本文从初学者角度出发,详细介绍了 React 中表单处理的基本概念、常见问题及解决方案。涵盖受控组件与非受控组件的区别、状态更新、表单验证、多字段管理及高级技巧,通过代码示例帮助读者更好地理解和应用。
304 7
|
前端开发 计算机视觉
React使用antd实现可编辑单元格
React结合Ant Design实现可编辑单元格的表格组件,通过EditableRow和EditableCell封装实现单元格编辑功能,并提供saveFun回调保存编辑内容。
572 1
|
移动开发 JSON 数据可视化
精选八款包括可视化CMS,jquery可视化表单,vue可视化拖拉,react可视化源码
精选八款包括可视化CMS,jquery可视化表单,vue可视化拖拉,react可视化源码
238 0
|
人工智能 前端开发 JavaScript
react js 处理表单( form )的2个例子
react js 处理表单( form )的2个例子
|
监控 前端开发 搜索推荐
react 表单受控的现代实现方案
`react-form-simple`是一个轻量级的React表单库,专注于简化受控表单的开发,提供数据绑定、验证、错误处理和UI更新等功能。它通过简洁的API减少复杂性,支持第三方UI库集成,并具备高度可扩展性。核心特点包括基于Proxy的数据绑定、实时错误处理、高效的UI更新和灵活的使用方式。通过`useForm`和`render`等钩子,开发者可以快速构建表单应用,同时支持动态表单和自定义验证规则。该库旨在提高开发效率,适用于复杂表单场景,降低学习和维护成本。
439 2
react 表单受控的现代实现方案
|
容器 Kubernetes Docker
云原生JSF:在Kubernetes的星辰大海中,让JSF应用乘风破浪!
【8月更文挑战第31天】在本指南中,您将学会如何在Kubernetes上部署JavaServer Faces (JSF)应用,享受容器化带来的灵活性与可扩展性。文章详细介绍了从构建Docker镜像到配置Kubernetes部署全流程,涵盖Dockerfile编写、Kubernetes资源配置及应用验证。通过这些步骤,您的JSF应用将充分利用Kubernetes的优势,实现自动化管理和高效运行,开启Java Web开发的新篇章。
138 0