react 表单组件 异步渲染,值不会生效,需要手动改变对应组件的显示值
楼主遇到这个问题已经是第二次,上次我们项目经理给帮忙解决了一次,这次又遇到了,刚开始不知道是这个问题,上次做的笔记也没找到了,估计又忘记了,这里抽三分钟记录一下,
当然这里这样做有个前提:就是你已经和后台交互成功了,不然当测试全局刷新界面时,可能会出问题哟!(要根本上解决该问题,应该是在封装的ajax请求哪里在返回一个data,参见后面的eg:
return data;
)
如果不设置如图一

如图二 才是想要的效果展示

this.props.form.setFieldsValue({searchAt: '1'});
this.props.form.setFieldsValue({searchFrom: '1'});
//或者
{
title: '修改',
key: 'update',
render: (text, record, index) => <Icon type="edit" onClick={() => {
this.props.form.setFieldsValue({name: record.name});
this.showModal(`${record.id}`)
}}/>
},
//修改一条数据
async updataRoom(value) {
const {data} = await request(
{
method: 'put',
url: '/api/room',
data: value
},
{message: '保存成功'},
{message: '保存失败'},
);
this.setRoom(data);
return data;
}
react 表单组件 异步渲染,值不会生效,需要手动改变对应组件的显示值的更多相关文章
- 通过html()的方法获取文本内容, form表单组件显示的值与获取到的值不一致的问题
我在通过 html()获取对应节点的内容,发现一个问题,获取到的 form表单组件的内容值是初始加载的值,而不是经过用户修改后的值.例如页面加载时组件<input type="text ...
- React表单组件自定义-可控及不可控组件
一.可控组件 <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset=" ...
- reactjs入门到实战(八)----表单组件的使用
表单组件支持几个受用户交互影响的属性: value,用于 <input>.<textarea> 组件. checked,用于类型为 checkbox 或者 radio 的 &l ...
- ReactJS实用技巧(2):从新人大坑——表单组件来看State
不太清楚有多少初学React的同学和博主当时一样,在看完React的生命周期.数据流之后觉得已经上手了,甩开文档啪啪啪的开始敲了起来.结果...居然被一个input标签给教做人了. 故事是这样的:首先 ...
- 如何实现Ant design表单组件封装?
目标:自己实现一个antd表单组件 先看下Ant Design官网上给出的表单组件用法: import React, { Component } from 'react' import { Form, ...
- django基础之day09,创建一个forms表单组件进行表单校验,知识点:error_messages,label,required,invalid,局部钩子函数,全局钩子函数, forms_obj.cleaned_data,forms_obj.errors,locals(), {{ forms.label }}:{{ forms }},{{ forms.errors.0 }}
利用forms表单组件进行表单校验,完成用户名,密码,确认密码,邮箱功能的校验 该作业包含了下面的知识点: error_messages,label,required,invalid,局部钩子函数,全 ...
- 【form】 表单组件说明
form表单组件 1)将form组件内的用户输入的<switch/> <input/> <checkbox/> <slider/> <radio/ ...
- 使用iview 的表单组件验证 Upload 组件
使用iview 的表单组件验证 Upload 组件 结果: 点击提交按钮, 没有填的form 项, 提示错误, 当填入数据后提示验证成功 代码: <template> <div id ...
- 文档驱动 —— 表单组件(五):基于Ant Design Vue 的表单控件的demo,再也不需要写代码了。
源码 https://github.com/naturefwvue/nf-vue3-ant 特点 只需要更改meta,既可以切换表单 可以统一修改样式,统一升级,以最小的代价,应对UI的升级.切换,应 ...
随机推荐
- 微信小程序学习记录(一)
如何定义一个全局变量: 1,在根目录下app.js中添加 App({ globalData: { g_isPlayingMusic : false, g_currentMusicPostId :nul ...
- Vue.js-组件化前端开发新思路
Vue.js-组件化前端开发新思路 12017.04.14 18:31:25字数 6228阅读 5632 本文章是我最近在公司的一场内部分享的内容.我有个习惯就是每次分享都会先将要分享的内容写成文章. ...
- Zotero使用教程(1)-安装及配置
小书匠kindle 作为一名科研人员,经常要阅读大量文献(当然我收集>>阅读,哎!),收集来的文献一般我们使用文件夹管理,通常使用文件夹命名和层级分布解决论文的分类问题. 但是,实 ...
- 30行左右代码实现一个类似httprunner的接口框架
框架的最终归宿往往是领域语言+模板解析. 首先先约定一种所要执行操作的表述格式.然后通过模板解析将描述语言转化为代码进行执行.例如,我们可以使用以下yaml文件描述多个步骤并且需要关联的接口: api ...
- expect 实例
[root@runstone ssh_lianxi]# cat expect.sh #!/usr/bin/env expect } { #判断命令行参数的个数 send_user "usag ...
- Tkinter 之Label标签
一.参数说明 语法 作用 Label(window,text=‘xxxxx’) 需要在界面显示的Label标签内容 Label(window,text=‘xxxxx’,height=2) 组件的高度( ...
- hello world&Restart the Journey
一个女OIer. 总结,游记,集训日志在博客园:题解大多在洛谷. 洛谷博客点这里. $\texttt{ You can go on,just take me with you.}$ 可以叫我Har ...
- java 通过runtime 调用python 不显示python运行内容的bug
先说下上面问题的原因,上面问题是因为python中用到了第三方的类库,你的电脑上没有那个类库,所以程序没有运行,在控制台也就看不到输出.只要导入那个类库就好... python 导入类库,可以单独下载 ...
- Dubbo的SPI是个什么鬼
原文:https://mp.weixin.qq.com/s/bQc_tASkfsojlcd897kLtA # spi 是啥? spi,简单来说,就是 service provider interfac ...
- 如何从DOS命令窗口进行复制粘贴
在DOS窗口没有右键复制按钮,那我们如果想要进行复制粘贴该如何操作呢?本篇就来说明一下这个操作流程. 工具/原料 WIN7系统 方法/步骤 按“WIN+R”调出运行页面,在其中输入CMD然 ...