Meteor/React, перенаправить маршрут после changeState

Question

У меня есть проблема с перенаправлением маршрутов с помощью реагирующего маршрутизатора после изменения состояния.

Фактически, мой маршрут работает, когда я использую событие click, которое меняет состояние (currentListId), но оно не работает, когда я удаляю элемент по Id (listId), поэтому после setState (listSelected: " ") ... Мои маршруты по-прежнему отображают/idlistselected, а затем перенаправляют на /.

Вот код: Код

Страница:

constructor(props) { 
    super(props); 
    this.state = { listSelected: "" }; 
    this.selectList = this.selectList.bind(this); 
} 

selectList(listId) { 
    this.setState({ listSelected: listId }); 

    // Here, only the if listId Works 
    if (listId) 
     browserHistory.push('/admin/todos/' + listId); 
    else 
     browserHistory.push('/admin/todos/'); 
} 

render() { 
    return (
      <ListPanel 
       listSelected = {this.state.listSelected} 
       selectList = {this.selectList} 
       lists = {this.props.lists} 
       tasks = {this.props.tasks} 
      /> 

Тогда ListPanel:

renderLists() { 
    return this.props.lists.map((list) => (
     <List 
      selectedItemId ={this.props.listSelected} 
      selectList = {() => this.props.selectList(list._id)} 
      key = {list._id} 
      list = {list} 
      countPendingTasks = {this.countPendingTasks(list._id)} 
     /> 
    )); 
} 

И, наконец, список:

deleteThisList() { 
    Meteor.call('lists.remove', this.props.list._id, (err) => { 
     if (!err) { 
      this.props.selectList(null); 
     } 
    }); 
} 

render() { 
    return (
     <ListGroupItem 
      className={(this.props.list._id == this.props.selectedItemId) ? 'active' : ''} 
      onClick={this.props.selectList} 
     > 
      {this.props.list.name} 

      <Glyphicon className="pushRight red"onClick={() => this.deleteThisList()}/> 
     </ListGroupItem> 
    ); 
} 

Если отобразился listId в SelectList, у меня есть прошлый ID, когда я удалить список .. Я не могу найти, почему, потому что я поставил его в нуль в функции удаления ...

Спасибо за помощь.

Answer 1

Вы перекрывая аргумент selectList, когда вы передаете его к List компонента, таким образом, если вы звоните this.props.selectList в компоненте ребенка, исходная функция не вызывается с list._id, независимо от того, какие аргументы вы даете ему.

Вы можете исправить это, просто передавая функцию selectedList вниз без привязки аргумента, а затем просто назвав его с list._id в List компонента:

<List 
    selectList = {this.props.selectList} 
    ... 

И в List компоненте

<ListGroupItem 
    onClick={() => this.props.selectList(list._id)} 
    ... 

В настоящее время null передано в deleteThisList Функция должна получить p правильно.