Javascript 在React中选择第一次之后不工作的事件

我有一个选择过滤器菜单，其中包含5个不同的选项。当页面加载和刷新时，此事件工作正常。当我尝试连续选择选项时，它不会根据选项过滤内容

守则的一部分是：

<div className="filter_role">Role{" "}<select 
                    defaultValue={this.state.role}
                    onChange={this.filterRole.bind(this)}
                    >
                    <option value="">All</option>
                    <option value="Batsman">Batsman</option>
                    <option value="Wk-Batsman">WK-Batsman</option>
                    <option value="Bowler">Bowler</option>
                    <option value="All-Rounder">All-Rounder</option>
                    </select>
 </div> 


 filterRole = (event) => {

    if(event.target.value === "") {
        this.setState({role:event.target.value, players: this.state.players})
    } else {
        this.setState({
            role: event.target.value,
            players: this.state.players.filter(player => player.role.indexOf(event.target.value)>=0)
        })
    }
    console.log(event.target.value)
}

角色{”“}
全部的
击球手
击球员
投球手
多面手
filterRole=（事件）=>{
如果（event.target.value==“”）{
this.setState（{role:event.target.value，players:this.state.players}）
}否则{
这是我的国家({
角色：event.target.value，
players:this.state.players.filter（player=>player.role.indexOf（event.target.value）>=0）
})
}
console.log（event.target.value）
}

---

我做错了什么？有人能帮我吗。

我想你过滤的方式不对，应该是这样的：

this.state.players.filter(player => player.role.indexOf(event.target.value) < 0)

this.state.players.filter（player=>player.role.indexOf（event.target.value）<0）