代码书写错误

在构造中定义变量，切记不要以var的形式定义，应该用this

constructor({width,min,max}){
        super();

    ×   var bigamount = Math.ceil(width/60);
    √   this.bigamount = Math.ceil(width/60);
     }

---

react中添加dom节点,以数组的形式添加，切记最后有return is;

    showis(){
        var is = [];
        var length = this.bigamount * 5+1 ;
        for(var i = 0 ; i < length; i++){
            is.push(<i key={i}></i>);
        }
        return is;
    }

---

i是行内元素，不能设置宽高，在这里i定义的是刻度，所以要写float: left；脱标。否则设置不出他的颜色和宽高。

    i{
            float: left;
            width: 1px;
            height: 18px;
            background-color:orange; 
        }

---

为dom节点批量设置一些共有属性，就没必要写在less文件中。
可以在生命周期中定义。
形式要巧妙地用到ref属性，ref属性写在父元素中，通过find来绑定

$(this.refs.range).find(".scaleline i")

---

想要选择第几个模型的时候，用eq，但注意eq从0计数，想要选择第五个，不不能如下直接5n

×
$(this.refs.range).find('.scaleline i').eq(5n).css("height",25);
√
$(this.refs.range).find('.scaleline i:nth-child(5n+1)').css("height",25);

---

$(this.refs.span_container).append($("<span>111</span>")) 
$(this).append("<u></u>");

追加到span_container的后面
append() - 在被选元素的结尾插入内容
prepend() - 在被选元素的开头插入内容

注意：追加元素节点时，带有引号，否则追加不上去，但是push的时候不加引号。

showis(){
        var is = [];
        for(var i = 0 ; i < length ; i++){
            is.push(<i key={i}></i>);
        }
        return is;
    }

---

    componentDidMount(){

        let barleft = $(this.refs.range).find(".bar").offset().left; 
        let barright= $(this.refs.range).find(".bar").offset().left + $(this.refs.range).find(".bar").width();

        console.log(barleft);
        console.log(barright);

        $(this.refs.range).find("b.right").draggable({
            axis:"x",
            //这里不能写this.barleft
            //我也不知道为什么，先记下来，以后再对比
            containment:[barleft,0,barright,0]
        });

    }

---

切记这样从函数中统一写dom然后返回给render，
切记函数里第一步要return

render(){
        return(
             <div className="filterbar">
                  <div className="row">
                     <div className="col-lg-1">学校</div>
                     <div className="col-lg-11">
                         {this.showshape()}
                     </div>
                  </div>
             </div>
            )
    }

if(this.state.shape=="radio"){
    return <div className="radio">
            {<a href="#" className="mutibtn">多选+</a>}   
            </div>
        }

中

if(this.state.shape=="radio"){
    return .........
}

---

this.state={
        "v" : [],
        shape:"radio"
    }

改变状态，item必须要加[ ] ，因为v是数组
改变状态，必须是setState({});
* chooseradio是onclick绑定的函数

chooseradio(item){
    √  this.setState({"v":[item]}); 
    ×  this.setState("v": item ); 
}

还有传入的item没有{ }

√   chooseradio( item ){}
×   chooseradio( {item} ){}

---

点击事件的监听应该有()=>

（一般都是前两种。第三种有时不行）
√    onClick={()=>{this.gonext()}}
√    onClick={()=>{this.chooseradio(item)}}
√    onClick={(this.changeShape).bind(this)}
×    onClick={()=>{this.gonext.bind(this)}}
×    onClick={this.chooseradio(item)}

---

render(){
    return (
           // 这里直接显示不出来，会显示div里是个空数组
         × <div>{this.props.nowfilter}</div>  
           // 必须要JSON.stringify，变为字符串输出
         √ <div>{JSON.stringify(this.props.nowfilter)}</div>
        );
    }
}

export default connect((state)=>{
    return {
        "nowfilter" : state.investReducer.nowfilter
    }
})(Invest);

---

从外链引用函数时一定要暴露，

createDateTable.js

function dealwith(year,month){

        return{
            reararr,
            midarr,
            nextarr
        }
}

export default dealwith;

引用时

import dealwith from "./createDateTable.js";

就可以直接使用delwith函数了

---

根据函数选择td的样式，引用函数时一定要记得return

<td className={classname(index)} key={index} >{day}</td>

let classname=(index)=>{
    if( index < reararr.length ){
        return "gray";
    }
}

---

componentDidMount(){
       //一定要写在滚轮的外面，生命周期的里面
        var self = this;
        $(this.refs.head).mousewheel(function(event,delta){
        //写滚轮事件不要忘了加这个，否则滑的时候页面来回动
            event.preventDefault();
            if( delta > 0 ){
                // console.log("向上滑");
                self.clickLeft();
            }else{
                // console.log("向下划");
                self.clickRight();
            }
        })

}

---