React 急急如律令

1.ES6

ES5	ES6
var	var let const
function (){} function foo(){}	()=>{} foo(){}
function (){     foo:function(){} }	class A{     foo(){} } new A{}
var name='aa',       age=21; return{       name: name,       age: age }	var name='aa', age=21; return{name,age}
	module.exports=A

2.JQuery

2.1 查询:

    $('#id')

    $('.class')

2.2 dom和jquery对象切换

let $div = $('#div'),
    div = document.getElementById('div');
console.log($div === div)
..false
console.log(div === $div[0])
..true
console.log($(div) === $div)
..true

 

2.3 ajax

$.ajax({

      //content

});

2.4 promise

promise.done(fn).fail(fn).always(fn);

 

3.React

3.1 对象:

React

ReactDom

3.2 方法:

React.createClass({});

ReactDom.render(sources,target);

3.3特性:

3.3.1 state(状态):

getInitialState(

return{

   key: value

}

)

setState({key: value});//不能用”=”赋值

事件—>状态—>渲染

3.3.2 props(属性):

getPropTypes(

return {

    key: value.isRequired//指定属性的类型.是否必须

}

)

属性由父级传入,状态由自己控制.

3.3.ref(内部Id):

render(){

return {

<p ref='text' >123</p>

<button οnclick=onclick() />

}

onclick(){

this.refs.text.props.value:123

}

4.生命周期

getPropType();

getInitialState();

componentWillMount();

render();

componentDidMount();

componentWillUpdate();

render();

componentDidUpdate();

componentWillUnMount();

 

未完待续…

转载于:https://www.cnblogs.com/jun3101s/p/5719795.html