将传递数据属性反应到DOM

Question

我正在扩展一个组件，并希望为其添加额外的属性。要使用以下方法添加新的类属性：

extraProps.className = 'some-value';

或ID ...

extraProps.ID = 'some-value';

但是如何添加数据属性？例如data-my-attribute

我尝试过camelCase约定：

extraProps.dataMyAttribute = 'some-value';

...但它并没有在输出的HTML中添加破折号。它输出dataMyAttribute='some-value'

完整代码：

function addMyProp( extraProps, props ) {

    extraProps.dataSomeAttribute = 'something' // it doesn't add the data- prefix

    return extraProps;
}

Answer 1

对于数据属性起反应doesn't require camel case。

您是否尝试过extraProps['data-my-attribute'] = 'something'？

Answer 2

您可以使用直接方式添加它：

<SomeComponent dataMyAttribute='something' ... />

？ 或者也许问题不是在添加属性而是在您尝试运行它的地方？