傳遞@states和道具彈出模型

我使用反應js爲我的意見！我正在彈出一個彈出窗口，顯示用戶鍵入的數據的一些細節，彈出窗口會在點擊提交按鈕後顯示！如何將作業狀態通過單擊提交按鈕傳遞給彈出窗口？彈出代碼是！（使用咖啡腳本）傳遞@states和道具彈出模型

@Jobs.TipIncrease = React.createClass 
 
     displayName: "TipIncrease" 
 

 
     componentDidMount: -> 
 
    $(".ui.modal").modal 
 
     # detachable: false 
 
     onApprove: => 
 
     data = 
 
      meet_at_car: false 
 
     @disableButtonShowSpinner() 
 
     @props.saveJobValues(data, @props.handleSubmit) 
 
     onDeny: => 
 
     data = 
 
      meet_at_car: false 
 
     @disableButtonShowSpinner() 
 
     @props.saveJobValues(@props.handleSubmit) 
 

 
    disableButtonShowSpinner: -> 
 
    $("#submit-done").addClass('hide') 
 
    $("#submit-button").addClass('disabled').css("padding", "1.5em") 
 
    $("#submit-spinner").removeClass('hide') 
 

 
    render: -> 
 
    job = @props.job 
 
    # @setState jobs: jobs 
 
    # CSS & Stylings 
 
    modalStyle = 
 
     maxWidth: "33%" 
 
     marginLeft: "-275px" 
 
    # Render 
 
    React.DOM.div 
 
     className: "ui modal" 
 
     # style: modalStyle 
 
     React.DOM.div 
 
     className: "header" 
 
     "Increase Tip peeps" 
 

 
     # Gogetter Tips 
 
     React.DOM.div 
 
     className: "row" 
 
     # style: borderBottom 
 
     React.DOM.div 
 
      className: "sixteen wide column" 
 
      className: "content" 
 
      React.createElement Jobs.TipBox, 
 
      # poster_tip: job.poster_tip 
 
      saveJobValues: @props.saveJobValues 
 

 
     React.DOM.div 
 
     className: "actions" 
 
     React.DOM.div 
 
      className: "ui red cancel inverted medium button" 
 
      style: padding: "9px 50px 7px 17px" 
 
      React.DOM.i 
 
      className: "remove icon" 
 
      "Later" 
 
     React.DOM.div 
 
      className: "ui green ok inverted medium button" 
 
      style: padding: "9px 60px 7px 17px" 
 
      React.DOM.i 
 
      className: "checkmark icon" 
 
      "Submit"

這裏（poster_tip：job.poster_tip）海報尖是不確定的。多數民衆贊成在我面臨的問題，因爲國家沒有通過！我正在展示它！

  # Done button 
     React.DOM.div 
     className: "sixteen wide column" 
     React.createElement Jobs.Button.DoneModal 
     # TipIncrease at Car Modal 
     React.DOM.div 
     className: "sixteen wide column" 
     React.createElement Jobs.TipIncrease, 
      saveJobValues: @props.saveJobValues 
      handleSubmit: @props.handleSubmit

彈出窗口工作正常，但它沒有采取創建工作的狀態！

@Jobs.Button.DoneModal = React.createClass 
 
    displayName: "Button-DoneModal" 
 

 
    showModal: -> 
 
    # $(".ui.small.modal").modal("show") 
 
    $(".ui.modal").modal("show") 
 
    $('.ui.dimmer.modals').appendTo('.ui.fluid.container.pushable'); 
 

 
    render: -> 
 
    # CSS & Stylings 
 
    buttonStyle = 
 
     backgroundColor: "#00b4ad" 
 
     color: "white" 
 
     borderRadius: "2em" 
 
     width: "100%" 
 
     padding: "1em" 
 
     fontSize: "18px" 
 
     margin: "1em auto" 
 

 
    # Render 
 
    React.DOM.button 
 
     type: "button" 
 
     className: "ui button" 
 
     id: "submit-button" 
 
     onClick: @showModal 
 
     style: buttonStyle 
 
     React.DOM.span 
 
     id: "submit-done" 
 
     "DONE" 
 
     React.DOM.div 
 
     className: "ui small hide active loader" 
 
     id: "submit-spinner"

我怎麼會把狀態？錯誤是：

(Uncaught Error: Invariant Violation: setState(...): Cannot update during an existing state transition (such as within render). Render methods should be a pure function of props and state.)

來源

2016-02-13 bilal

請更新您粘貼的代碼中的縮進，這在coffeescript中很重要;否則很難讀取代碼邏輯。 –

@ArieShaw它幾乎正確！它的超級難以在這裏正確縮進！我收到錯誤！（未捕獲錯誤：不變違例：setState（...）：無法在現有狀態轉換期間更新（例如'render'內）。渲染方法應該是道具和狀態的純函數。） – bilal

我想獲取當前「提示」狀態並將其顯示到模型中，但每次我都可以工作。提示其未定義！ – bilal

當您創建Jobs.TipIncrease，你使用：

React.createElement Jobs.TipIncrease, 
    saveJobValues: @props.saveJobValues 
    handleSubmit: @props.handleSubmit

所以只會出現在Jobs.TipIncrease體內可用兩個屬性：saveJobValues和handleSubmit。參考@props.jobs結果在undefined。您需要在這裏添加條目jobs: your_jobs。

我沒有看到setState電話在您的代碼粘貼，必須有其他地方，你錯過了。

來源

2016-02-15 13:24:14

這就是我感到困惑的事情如何/我會在模型中設置狀態！ – bilal

傳遞@states和道具彈出模型

回答

相關問題