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. @noi.ac - 489@ shuffle

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个长度为 n 的序列 s1,s2,-,sn,它有 2^n− ...

  2. 什么是HOOK技术

    https://zhidao.baidu.com/question/50557962.html HOOK技术是Windows消息处理机制的一个平台,应用程序可以在上面设置子程序以监视指定窗口的某种消息 ...

  3. 2002年NOIP普及组复赛题解

    题目涉及算法: 级数求和:入门题: 选数:搜索: 产生数:搜索.高精度: 过河卒:动态规划. 级数求和 题目链接:https://www.luogu.org/problemnew/show/P1035 ...

  4. 如何安装Anaconda和Python

    1.下载安装文件 https://www.anaconda.com/download/ 2.百度安装方法:https://jingyan.baidu.com/article/3f16e0031e875 ...

  5. .net连接数据库

    /* 连接数据库步骤-- 1.创建连接字符串 data source = ... 计算机名称 initial catalog = ... 数据库名称 integrated security = tru ...

  6. NuGet 符号服务器

    在新的 VisualStudio 支持使用 NuGet 符号服务器,可以支持新的 Portable PDB 调试符号的库,本文告诉大家如何打包上传带符号的库和使用符号服务器 在 2018 的 11 月 ...

  7. 5款顶尖Windows文件传输工具

    5款顶尖Windows文件传输工具 英文原文: Drasko 日常工作中,公司里的系统管理员或其他岗位的员工都需要传递大量各种类型的文件和文档.其中一些可以通过 email 收发.但由于 email ...

  8. H3C 端口绑定典型配置举例

  9. 圆角效果 border-radius——阴影 box-shadow——为边框应用图片 border-image

    1.圆角效果 border-radius border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角.右上角.右下角和左下角,顺时针 */ 不要以为border-ra ...

  10. Common Logging包装设计

    类设计 LogFactory根据当前环境加载具体的Log实现: 1.从缓存中加载LogFactory 2.从系统属性org.apache.commons.logging.LogFactory 中加载L ...