state的基本使用：状态（state）即是数据,是组件内部的私有数据，只能在组件内部使用，且state的值是对象，表示一个组件中可以有多个数据 初始语法： 123456789101112131415class KEL extends React.Component { constructor() { super () { // 初始化state this.state = { count: 0 } } render () { return { <div>有状态组件</div> } } }} 简化语法：

只有类组件下有这个问题（函数组件没有this） 利用bind修改this指向组件： 1234567891011121314class HEL extends React.Comonent { num = 0; addNum() { this.num += 1; alert(this.num) } render () { return ( <div> <h1 onClick={this.addNum.bing(this)}>数字加一</h1> </div> ) }} 利用箭头函数方法（推荐）：该语法是实验性语法，由于babel的存在可以直接使用

​ 事件绑定：React事件绑定语法与DOM事件语法相似，而语法则是on+事件名称={事件处理程序fn}需要注意的是React事件则采用小驼峰命名法：除第一个单词之外，其他单词首字母大写。 类 组件绑定： 12345678910class KL extends React.Component { headrClick () { ... } render () { return ( <button onClick={this.headrClick}></button> ) } } 函数组件绑定:

父类：

Query中常用的样式操作：Jcss()和设置类样式方法 操作css方法：JQuery使用css方法修改简单元素样式，操作类，修改多个样式 123456// 1.参数只写属性名，则返回属性值 var strColor = $(this).css('color');// 2.参数是属性名，属性值，逗号分隔（英文），设置一组样式，属性须加引号，如果是数字可不用加单位和引号 $(this).css("color", "red");// 3.参数可以是对象形式(css()用于样式少时)$(this).css({"color":"white", "font-size":"20px"}); 设置类样式：等同于classList，可以操作样式，注：操作类不加点且不会覆盖原先的类名

React组件创建：特点：复用 独立 可组合 函数创建：使用JS函数或箭头函数创建的组件 1234567891011import React from 'react';const Dnz = () => { return ( <div> <h2>函数组件</h2> <p onClick={fn}>点击</p> </div> )}ReactDOM.render(<Dnz />, root) 【注意事项： ​ 1.类与函数名称都需以大写字母开头，使用大驼峰命名法。 ​ 2.函数组件必须有返回值，表示该组件的结构，而类组件则需提供render()方法。