2015-11-02 111 views
0

使用backbone-react-component我想構建一個任務列表的排序。如果你看看snipplet,你會看到核心變量tasksListtasksListChild,其中我的代碼迄今爲止似乎渲染到儘可能多的_createTaskChild但渲染超出了我沒有任何東西,從字面上看,甚至沒有在控制檯窗口中的錯誤。我把console.log在這裏更好的闡述一下,哪裏有什麼樣的失敗?console.log(model.get('task_id'));會把控制檯放出來沒問題。然而,console.log('hi')沒有。我希望通過來這裏額外的眼睛可以告訴我在哪裏搞砸了。ReactJS Parent not rendering Children

var tasksListChild = React.createClass({ 
    mixins: [BackboneReactMixin], 
    render: function() { 
     console.log('hi') 
     return (
      <span onClick={ this._handleTaskClick }>nothing</span> 
     ); 
    }, 
    _handleTaskClick: function (event) { 
     console.log(this.props) 
    } 
}); 


var tasksList = React.createClass({ 
    mixins: [BackboneReactMixin], 
    render: function() { 
     return (
      <div className="list-group js__page-list-group-tasks"> 
      { 
       this.getCollection().map(this._createTaskChild) 
      } 
      </div> 
     ); 
    }, 
    _createTaskChild: function (model) { 
     console.log(model.get('task_id')); 
     return (
     <a className="list-group-item"> 
      <tasksListChild key={model.get('task_id')} model={model} /> 
     </a> 
     ); 
    } 
}); 
+0

是什麼this.getCollection()返回數組? –

+0

mixin提供的功能可以橋接反應和主幹。據我瞭解,它需要傳遞的集合作出反應,並將聽衆與聽衆聯繫起來,以應對反應。但是在這種情況下,假設我的理解是正確的,那麼它應該把集合傳遞並使用map將它分解爲每個子視圖的單個模型 – chris

+0

您需要知道getCollection返回的內容,以便了解你正在映射。 key = {model.get('task_id')}暗示該對象具有嵌入的get函數。這是不常見的。 –

回答

0

請問這項工作。

_createTaskChild: function (model) { 
 
     var taskID = model.get('task_id'); 
 
     console.log(taskID); 
 
     return (
 
     <a className="list-group-item"> 
 
      <tasksListChild key={taskID} model={model} /> 
 
     </a> 
 
     ); 
 
    }