javascript - 从 React 中的 material-ui Button 获取值

标签 javascript reactjs material-ui formik

我有这个功能

handleChangeButton = (e) => {
    alert(e.target.value)
    this.props.setFieldValue('degreeLevel', e.target.value);
  }

在我的组件渲染中,我有

<div className="twelve columns">
            <p>Degree Level</p>
            <Button
              variant="raised"
              label="Default"
              onClick = { this.handleChangeButton }
              value="Doctorate"
            >
              Doctorate
            </Button>

            <Button variant="raised" label="Default">
              Masters
            </Button>

            <Button variant="raised" label="Default">
              Undergraduate
            </Button>
          </div>

所以,我想做的是,当我点击Doctorate按钮时,它应该this.props.setFieldValuedegreeLevel,这是我的 Formik 表单中的字段之一。当我单击该按钮时,警报显示 undefined,这意味着它没有读取值 Doctorate

如何让 e.target.value 读取按钮的值?

最佳答案

使用currentTarget代替target

handleChangeButton = (e) => {
    alert(e.currentTarget.value)
    this.props.setFieldValue('degreeLevel', e.currentTarget.value);
}

关于javascript - 从 React 中的 material-ui Button 获取值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50414059/

相关文章:

javascript - 如何设置 Material ui时间选择器对话框样式

javascript - 是否可以为凸起按钮添加自定义悬停颜色?

javascript - Reactjs Material-UI 菜单项中的 "Deprecated. Instead, use composability."是什么意思?

javascript - canvas - 获取线上的像素

javascript - 将 promise 转换为 async await 的时机

javascript - 如何使用经过身份验证的 id token 和数据库规则保护 Firebase Cloud Function HTTP 端点?

javascript - 如何使用 Firebase 和 useEffect() 正确更新状态?

reactjs - @tailwindcss/forms 插件不适用于 React

javascript - 使用别名导入默认值

javascript - Yeoman 生成器提示