Question

我正在使用反应js来表达我的观点！我正在弹出以显示用户键入的数据的一些细节，弹出窗口将在单击提交按钮时显示！如何在单击提交按钮时将作业状态传递给弹出窗口？弹出的代码是！（使用咖啡脚本）

＆＃13;

    @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"

＆＃13;

这里（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

弹出窗口工作正常，但它没有创建作业的状态！

＆＃13;

@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"

＆＃13;

我将如何通过各州？错误是：

( 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. )

Answer 1

创建Jobs.TipIncrease时，您正在使用：

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

因此Jobs.TipIncrease正文中只有两个可用的属性：saveJobValues和handleSubmit。引用@props.jobs会导致undefined。您需要在此处添加条目jobs: your_jobs。

我的代码粘贴中没有看到setState来电，必须有其他错过的地方。

将@states和props传递给弹出模型

1 个答案: