reactjs 事件的用法

组件由React自由方法和用户定义的方法构成


触摸:

onTouchCancel

onTouchEnd

onTouchMove

onTouchStart


键盘:

onKeyDown

onKeyPress

onKeyUp


剪切

onCopy

onCut

onPaste


表单:

onChange

onInput

onSubmit


焦点

onFocus

onBlur


UI

ocScroll


滚动

onWheel


鼠标

onClick

onContextMenu   //右键事件

onDoubleClick

onMouseDown

onMouseEnter

onMouseLeave

onMouseMove

onMouseOut

onMouseOver

onMouseUp

onDrop

onDrag

onDragEnd

onDragExit

onDragLeave

onDragOver

onDragStart



var HelloWorld=ReactClass({
handleChange:function(event){
console.log(event.target.value);
},
render:function(){
return

;
}
});
React.render(,document.body);


事件对象:

event.target 即为对象所对应的DOM元素

通用属性:

boolean bubbles

boolean cancelable

DOMEventTarget currentTarget

boolean defaultPrevented

number  eventPhase

boolean isTrusted

DOMEvent nativeEvent

void preventDefault()

void stopPropagation()

DOMEventTarget target

number timeStamp

String type


var HelloWorld=React.createClass({
getInitialState:function(){
return {
password:""
}
},
handleKeyPress:function(event){
this.setState({
password:this.state.password+event.which
});
console.log(this.state.password);
},
handleChange:function(event){
event.target.value="";
},
render:function(){
return



0?'inline':'none'>you get it!





}
});

事件和状态的关联

this.setState();


你可能感兴趣的:(JS)