[英]Access data-* attribute in HTML and pass it as props
How do I access the data-* attribute which is specified in HTML to be passed as props ? 如何访问HTML中指定为props传递的data- *属性?
If it is a normal attribute then we use this.getAttribute('class')
, in case of using data-class
webpack adds space data - class
. 如果它是普通属性,则在使用
data-class
webpack的情况下,我们使用this.getAttribute('class')
来添加空间data - class
。 How can we avoid webpack from adding space between hyphen. 我们如何避免webpack在连字符之间添加空格。
UPDATE : May be I need to be more specific, WebPack adds space while generating the code which contains the React Component props. 更新 :也许我需要更具体一些,WebPack在生成包含React Component属性的代码时增加了空间。
The generated code looks like, 生成的代码如下所示:
_createClass(App, [{
key: 'render',
value: function render() {
debugger;
return _react2.default.createElement(
'div',
null,
_react2.default.createElement(_header2.default, { options: this.props.options }),
_react2.default.createElement(_footer2.default, { options: this.props.data - footeroptions })
);
}
}]);
I think you just need to use string literals when referring to object properties with hyphens. 我认为在用连字符引用对象属性时,只需要使用字符串文字即可。
this.props.data-footeroptions
// should be written as
this.props.data['footeroptions']
Also for reference, I think this is probably a JSX problem, rather than WebPack. 同样作为参考,我认为这可能是一个JSX问题,而不是WebPack。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.