【问题标题】:Can´t access button value using material-ui无法使用 material-ui 访问按钮值
【发布时间】:2019-08-08 17:06:07
【问题描述】:

我必须访问一个按钮的值,因为它包含进一步进展所需的 ID。

我首先使用了一个带有一些引导样式的普通按钮,一切正常。

 <button
     value={row.vacationRequestID}
     className="btn btn-warning"
     onClick={myRef.handleDeclineClick.bind(myRef)}>No
 </button>

   handleDeclineClick(e, value) {
    console.log("decline");
    console.log(e.target.value) //ID: 120
   // this.props.declineClick(e);
    //dispatch(requestStatusUpdate(e.target.value, declined, reason))
}

现在使用 material-ui 后,我无法再访问该值了。

 <IconButton
    iconClassName="material-icons"
    tooltip="Ablehnen"
    value={row.vacationRequestID}
    ref={"dd"}
    onClick={myRef.handleDeclineClick.bind(myRef)}
     >
        thumb_down
    </IconButton>

我曾尝试通过 ref 访问它,但即使这样也无法正常工作。有人可以解释我为什么吗?文档没有说明价值。

【问题讨论】:

    标签: javascript reactjs material-ui


    【解决方案1】:

    使用currentTarget 而不是target

    handleDeclineClick(e, value) {
        console.log("decline");
        console.log(e.currentTarget.value);
    }
    

    Original Answer

    【讨论】:

      【解决方案2】:

      MaterialUI 不使用任何 value 属性。因此,当您将 value 属性设置为 IconButton 时,它基本上没有任何意义。

      如果您想将任何值传递给onClick 回调函数,请将值绑定到该函数。所以当它被调用时,你会得到它作为第一个参数。

      myRef.handleDeclineClick.bind(myRef, row.vacationRequestID)
      

      【讨论】:

      • 完美,有效!谢谢,我会在 5 分钟内接受你的回答;)
      猜你喜欢
      • 2021-08-20
      • 2020-02-15
      • 1970-01-01
      • 2021-07-02
      • 2019-10-31
      • 2020-12-03
      • 2020-07-06
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多