楼主遇到这个问题已经是第二次,上次我们项目经理给帮忙解决了一次,这次又遇到了,刚开始不知道是这个问题,上次做的笔记也没找到了,估计又忘记了,这里抽三分钟记录一下,

当然这里这样做有个前提:就是你已经和后台交互成功了,不然当测试全局刷新界面时,可能会出问题哟!(要根本上解决该问题,应该是在封装的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 表单组件 异步渲染,值不会生效,需要手动改变对应组件的显示值的更多相关文章

  1. 通过html()的方法获取文本内容, form表单组件显示的值与获取到的值不一致的问题

    我在通过 html()获取对应节点的内容,发现一个问题,获取到的 form表单组件的内容值是初始加载的值,而不是经过用户修改后的值.例如页面加载时组件<input type="text ...

  2. React表单组件自定义-可控及不可控组件

    一.可控组件 <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset=" ...

  3. reactjs入门到实战(八)----表单组件的使用

    表单组件支持几个受用户交互影响的属性: value,用于 <input>.<textarea> 组件. checked,用于类型为 checkbox 或者 radio 的 &l ...

  4. ReactJS实用技巧(2):从新人大坑——表单组件来看State

    不太清楚有多少初学React的同学和博主当时一样,在看完React的生命周期.数据流之后觉得已经上手了,甩开文档啪啪啪的开始敲了起来.结果...居然被一个input标签给教做人了. 故事是这样的:首先 ...

  5. 如何实现Ant design表单组件封装?

    目标:自己实现一个antd表单组件 先看下Ant Design官网上给出的表单组件用法: import React, { Component } from 'react' import { Form, ...

  6. 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,局部钩子函数,全 ...

  7. 【form】 表单组件说明

    form表单组件 1)将form组件内的用户输入的<switch/> <input/> <checkbox/> <slider/> <radio/ ...

  8. 使用iview 的表单组件验证 Upload 组件

    使用iview 的表单组件验证 Upload 组件 结果: 点击提交按钮, 没有填的form 项, 提示错误, 当填入数据后提示验证成功 代码: <template> <div id ...

  9. 文档驱动 —— 表单组件(五):基于Ant Design Vue 的表单控件的demo,再也不需要写代码了。

    源码 https://github.com/naturefwvue/nf-vue3-ant 特点 只需要更改meta,既可以切换表单 可以统一修改样式,统一升级,以最小的代价,应对UI的升级.切换,应 ...

随机推荐

  1. Mybatis的一级缓存机制简介

    1.接口 public interface MemberMapperCache { public Members selectMembersById(Integer id); } 2.配置文件xml ...

  2. python - super 寻找继承关系

    """ super 是根据当前类对象的 mro 的继承顺序进行函数的调用的 """ class Base(object): def fn(s ...

  3. 物联网之窄带物联网(NB-IOT)

    NB-IoT即窄带物联网(Narrow Band Internet of Things),NB-IOT构建在蜂窝网络之上,只消耗大约180KHZ的带宽,可直接部署于GSM(2G).UMTS(3G).L ...

  4. h5css样式

    兼容性前缀: 谷歌:webkit 火狐:moz ie:ms 欧鹏:o选择器: 属性选择器: * = 包含 {href * = 'www'} ^ = 以什么开头 $ = 以什么结尾 伪类选择器: 第一个 ...

  5. Java中实例方法和类方法的区别举例

    QAQQAQAQQQAQQAQQAQAQ import java.util.ArrayList; import java.util.Iterator; class myclass{ ; ; publi ...

  6. PHP怎么实现字符串转义和还原?

    首先大家可以简单了解下什么是转义字符?有什么用? 转义字符是一种特殊的字符常量.转义字符以反斜线"\"开头,后跟一个或几个字符.转义字符具有特定的含义,不同于字符原有的意义,故称“ ...

  7. 010_IAR安装

    链接:https://pan.baidu.com/s/14qZh1Gxl32dD2TWdjEYP7Q提取码:yj65 复制这段内容后打开百度网盘手机App,操作更方便哦 里面有安装说明 (一)编辑界面 ...

  8. 转,sql server update set from inner 批量修改的使用

    SQL update select结合语句详解及应用   QL update select语句 最常用的update语法是: 1 2 UPDATE TABLE_NAME SET column_name ...

  9. myeclipse2018修改主题

  10. MongoDB Wiredtiger存储引擎实现原理

    Mongodb-3.2已经WiredTiger设置为了默认的存储引擎,最近通过阅读wiredtiger源代码(在不了解其内部实现的情况下,读代码难度相当大,代码量太大,强烈建议官方多出些介绍文章),理 ...