react的列表最優(yōu)搜索方案

一個列表過濾功能 過濾條件 name == searchValue

方案一
在connect

const mapStateToProps = ({itemStore}, ownProps) => {
    const { searchValue, fullArr } = itemStore
    const subArr = fullArr.filter(item => item.name.indexOf(searchValue) > -1)
    return {
        ...itemStore,
        subArr,
    }
}

這樣每次store或者ownProps發(fā)生變化時候遍歷一次
優(yōu)點是代碼量少,邏輯簡單

方案二

在每次搜索條件onChange的時候和在queryData的時候就根據(jù)搜索條件去setState或者dispatch去改變subArr

方案三

在componentWillReceiveProps時候進行操作

// 使用redux規(guī)定每次查詢都返回一個新的list
componentWillReceiveProps(nextProps) {
    const { searchValue, fullArr } = this.props
    if(
        nextProps.fullArr !== fullArr ||
        nextProps.searchValue !== searchValue
    ){
        const subArr = .....
        this.setState({
            subArr,
        })
    }
}

這樣就性能比方案一好，但這顯得componentWillReceiveProps有點臃腫
目前我采用的是方案三

大神們給個建議