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. redis 写入数据 越来越慢 是什么原因

    redis并不会因为key的增加而导致写入明显变慢,肯定是其他因素.如果redis开启了持久化,在进行持久化时,性能必然下降,可以使用config命令查看持久化设置了没有.另外考虑是否是内存不足,一般 ...

  2. H3C 总线型以太网拓扑扩展

  3. springboot 实现 aop

    pom.xml 导入 springboot aop 依赖 <dependency> <groupId>org.springframework.boot</groupId& ...

  4. 2019-8-15-win10-edge-打开闪退问题

    title author date CreateTime categories win10 edge 打开闪退问题 lindexi 2019-08-15 08:53:22 +0800 2019-8-1 ...

  5. 714 - Copying Books——[贪心、二分查找]

    Before the invention of book-printing, it was very hard to make a copy of a book. All the contents h ...

  6. CF1055F Tree and XOR

    CF1055F Tree and XOR 就是选择两个数找第k大对儿 第k大?二分+trie上验证 O(nlognlogn) 直接按位贪心 维护可能的决策点(a,b)表示可能答案的对儿在a和b的子树中 ...

  7. H3C IP地址与子网掩码

  8. linux ioctl 方法

    ioctl, 我们在第 1 章展示给你如何使用, 是一个系统调用, 作用于一个文件描述符; 它 接收一个确定要进行的命令的数字和(可选地)另一个参数, 常常是一个指针. 作为一个使 用 /proc 文 ...

  9. html根据下拉框选中的值修改背景颜色

    错误的写法 <!doctype html><html><head><meta charset="utf-8"><title&g ...

  10. 【37.48%】【hdu 2587】How far away ?(3篇文章,3种做法,LCA之树上倍增)

    Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s) ...