placeHolder和defaultValue的区别

(1)placeHolder用于提示用户,它不与后端进行交互。

(2)defaultValue则是与后端交互时的默认值。

举例说明:在Select框中:

              <Select
id="stadiumId"
placeholder={this.state.stadiumName}
defaultValue={this.state.stadiumId}
style={{ width: 300 }}
onChange={e => {
this.handleStadium2(e);
}}
>

该控件既有placeHolder又有defaultValue属性,那么默认显示的是placeHolder中的内容。

此时如果用户不点击Select框,那么表单提交后,传到后端的值是defaultValue中的内容

注意: 如果控件只有defaultValue属性,那么就显示defaultValue中的内容,传到后端的值也是其中的内容。

placeHolder和defaultValue的区别的更多相关文章

  1. 夺命雷公狗-----React---18--value和defaultValue的区别

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  2. js解决IE8、9下placeholder的兼容问题

    由于placeholder是html5的新属性,在IE8.IE9下是不能显示的,有兼容性问题. 解决思路: 1.判断目前浏览器是否支持placeholder属性 2.若不支持,则将type=" ...

  3. 兼容IE浏览器的placeholder【超不错】

    jQuery EnPlaceholder plug (兼容IE浏览器的placeholder)使用 >>>>>>>>>>>>&g ...

  4. 继续JS之DOM对象二

    前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele ...

  5. web前端----JavaScript的DOM(二)

    前面在DOM一中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele_p ...

  6. 前端基础:JavaScript DOM对象

    JavaScript DOM对象 通过HTML DOM,可以访问JavaScript HTML文档的所有元素. 一.HTML DOM(文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(D ...

  7. CSS、JavaScript学习过程

    初学JavaScript,通过博客记录自己学习过程中遇到的问题.(包含少量CSS) 零碎记录 JavaScript 输出 type="text/javascript" 那些老旧的实 ...

  8. JS之DOM对象二

    前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement('a');添加节点:ele ...

  9. 前端之JavaScript:JS之DOM对象二

    继续JS之DOM对象二 前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement(' ...

随机推荐

  1. X-WAF 安装配置指南

    X-WAF 是一款方便易用的云WAF,使用反向代理的方式介入Web服务器和访问者之间,不需要像 modSecurity 和 Naxsin 那样作为nginx的模块,需要进行编译安装 X-WAF使用 O ...

  2. lodap问题集锦

    1.分页打印时,同一行显示在不同页内 ,调整行分页粒度 LODOP.SET_PRINT_STYLEA(0, "TableRowThickNess", 40);

  3. pycharm下的多个python版本共存(一)

    经历过IDLE,anaconda,和pycharn的编程环境,并进行了一段时间的项目编程后,决定使用pycharm作为以后的工作环境. 一方面因为项目组其他人推荐,另一方面在使用过程中比较顺手.当然很 ...

  4. Codeforces Round #529 (Div. 3) E. Almost Regular Bracket Sequence(思维)

    传送门 题意: 给你一个只包含 '(' 和 ')' 的长度为 n 字符序列s: 给出一个操作:将第 i 个位置的字符反转('(' ')' 互换): 问有多少位置反转后,可以使得字符串 s 变为&quo ...

  5. springboot中各个版本的redis配置问题

    今天在springboot中使用数据库,springboot版本为2.0.2.RELEASE,通过pom引入jar包,配置文件application.properties中的redis配置文件报错,提 ...

  6. springboot2.0.2+redis+spring-session 解决session共享的问题

    准备工作 新建两个springboot2.0.2版本的服务,配置文件添加: #在默认设置下,Eureka服务注册中心也会将自己作为客户端来尝试注册它自己,所以我们需要禁用它的客户端注册行为 eurek ...

  7. 2019-11-19-C#-高级面试题

    title author date CreateTime categories C# 高级面试题 lindexi 2019-11-19 08:40:50 +0800 2018-11-12 11:18: ...

  8. Roslyn 使用 Target 替换占位符方式生成 nuget 打包

    本文告诉大家如何编写在编译过程修改打包文件 在项目文件的相同文件夹可以放一个 nuspec 用来告诉 VisualStudio 如何打包 现在尝试创建一个项目 NearjerbetearDeeyito ...

  9. Linux 内核硬件资源

    一个 ISA 设备可配备有 I/O 端口, 内存区, 和中断线. 尽管 x86 处理器支持 64 KB I/O 端口内存(即, 处理器有 16 条地址线), 一些老 PC 硬 件仅解码最低的 10 位 ...

  10. 【58.75%】【BZOJ 1087】[SCOI2005]互不侵犯King

    Time Limit: 10 Sec  Memory Limit: 162 MB Submit: 3040  Solved: 1786 [Submit][Status][Discuss] Descri ...