Question

我最近开始使用Material Design React，但是我刚发现data-someField确实会将值传播到数据集映射。

示例：

<Input data-role=‘someValue’  onChange={this.onChange} />

onChange = e =>{
           const role = e.target.dataset.role
            const role2 = e.currentTarget.dataset.role
}

onChange处理程序中的两个角色均未定义。如果我将Input标签更改为常规html输入，则不会发生这种情况。

有什么想法为什么Material Design不允许数据属性或有任何解决方法？

提前谢谢！

---在@Springer建议之后，我尝试使用inputprops，但注意到只有name属性可用，其余的未定义。

```  <Input
                    value={role.name}
                    disabled={!this.state.editMode}
                    inputProps={{
                      name: 'MyName',
                      role: 'MyRole',

                      dataset: {
                        degree: 'Teniente'
                      },

                      data: {
                        roleId: role.uuid
                      },
                      dataRoleId: {
                        roleId: role.uuid
                      }
                    }}
                    disableUnderline={true}
                    data-role-id={role.uuid}
                    role={role}
                    onChange={this.onChangeExistingRole}
                  /> ```

Answer 1

在react material api中，他们使用inputProps传递Extrat对象（props，data ..）

请参见doc

inputProps：应用于输入元素的属性。

如何在Material Design React中使用数据属性？

1 个答案: