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. oracle的group by用法

    原文链接:https://www.cnblogs.com/Each-Person-Got-a-Dream/p/8946961.html sql如下: select min(es.sku_price) ...

  2. codeforces1249-div3

    A B C 等比数列的性质,前面的i项的和,不会超过第i+1项 D 有若干个区间,要求每一个点被区间覆盖的次数不能超过k个.问移除的最少的区间的数目. 贪心: 若某个点被覆盖了k次以上,那么肯定是移除 ...

  3. Flex AIR使用ADT命令打包 ipa

    1. 配置环境变量. 2. 测试adt命令 3. 将ShepherdPhone0815.mobileprovision和 my.p12文件都放入编译好的工程目录下,如下图: 4.切换到上述编译好的目录 ...

  4. Promise的封装

    要封装Promise,首先要了解Promise的使用. Promise有以下几个特点:1.Promise是一个构造函数 2.实例化Promise时有两个回调函数,resolve,reject ,成功执 ...

  5. H3C配置路由器作为TFTP客户端

  6. 2018-10-22-win10-uwp-自定义控件入门

    title author date CreateTime categories win10 uwp 自定义控件入门 lindexi 2018-10-22 09:47:54 +0800 2018-10- ...

  7. Numpy 返回数组大小

    import numpy as np a = [[1, 2], [3, 4], [5, 6]] b = np.array(a) len(a) # 3 len(b) # 3 np.size(a) # 3 ...

  8. java.lang.IllegalArgumentException: attempt to create saveOrUpdate event with null entity

    今天想把ssh整合的代码跑起来,控制台就一直在报错,搞了半天!!! Hibernate: select computer0_.computerId as computer1_0_, computer0 ...

  9. dotnet 通过 WMI 拿到显卡信息

    本文告诉大家如何通过 WMI 拿到显卡信息 如果使用的是 dotnet core 请先引用 Microsoft.Windows.Compatibility 才可以使用 WMI 代码 通过下面的代码可以 ...

  10. CodeForces - 1162E Thanos Nim (博弈论)

    Alice and Bob are playing a game with nn piles of stones. It is guaranteed that nn is an even number ...