reactjs 开发过程中遇到的一些问题

一. reactjs 渲染input后 ,为什么value设置了值的话就不可编辑了?

      用defaultValue 代替 value.

二.关于console的二三事.   

     1、console.log 用于输出普通信息
     2、console.info 用于输出提示性信息
     3、console.error用于输出错误信息

     4、console.warn用于输出警示信息

三.input的disabled属性

     w3c的官方解释:

     被禁用的 input 元素既不可用，也不可点击。可以设置 disabled 属性，直到满足某些其他的条件为止（比如选择了一个复选框等等）。

     然后，就需要通过 JavaScript 来删除 disabled 值，将 input 元素的值切换为可用。

     注释：disabled 属性无法与 <input type="hidden"> 一起使用。

     reactjs的情况:

     在reactjs当中不需要通过删除disabled来实现input的可编辑,只需要把disabled="disabled"改变为disabled=""即可.

四.onClick和onBlur冲突问题的快速解决方法

     在reactjs中我遇到了这个问题,是一个下拉菜单.具体代码如下:

     <li onClick={this.displayDownList} onBlur={this.hideDownList}>
        <ul>
              <li onClick={()=>this.props.itemClick("project:new")}>new</li>
              <li onMouseDown={()=>this.props.itemClick("project:open")}>open</li>
        </ul>
    </li>

     点击下拉菜单出现new与open两项.下拉菜单收起分别在点击new或open以及失去焦点的时候.如上:如果在li标签里边使用onClick,那么由于

     onBlur的优先级较高,也就是onBlur先执行,结果就是onClick执行不了.

     解决办法:

     目标是先执行onClick,然后再执行onBlur.由于onBlur是不能改变的所以只能考虑onClick.

     我是用onMouseDown代替了onClick.因为onMouseDown比onBlur优先级高,所以可以先执行.

     另外,在百度的时候发现有使用setTimeout解决的,延迟执行onBlur.我没试过,应该也是可以的.