访问HTML中的data- *属性并将其作为道具传递

Question

如何访问HTML中指定为props传递的data- *属性？

如果它是普通属性，则在使用data-class webpack的情况下，我们使用this.getAttribute('class')来添加空间data - class 。 我们如何避免webpack在连字符之间添加空格。

更新 ：也许我需要更具体一些，WebPack在生成包含React Component属性的代码时增加了空间。

生成的代码如下所示：

_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 })
                );
            }
        }]);

Answer 1

我认为在用连字符引用对象属性时，只需要使用字符串文字即可。

this.props.data-footeroptions
// should be written as
this.props.data['footeroptions']

同样作为参考，我认为这可能是一个JSX问题，而不是WebPack。