如何接受HTML属性data-*， aria-*

ReactJS - How to accept HTML attribute data-*, aria-*?

本文关键字：aria- data- 属性 何接受 HTML      更新时间：2023-09-26

我有一个小问题，而创建一个下拉菜单与引导，在文档https://facebook.github.io/react/docs/tags-and-attributes.html已经说过React支持所有的data-*和aria-*属性以及以下列表中的每个属性，所有属性都是骆驼大小写。。

交货:

React.DOM.div(
   {
      className: 'dropdown', // available
      dataToggle: 'dropdown', // not available
      ariaExpanded: true // not available
   }
)

运行时，属性data-*和aria-*不可用??我不知道为什么?我该怎么办呢?

简单回答:正常使用

data-toggle: 'dropdown'

根据React Docs:

所有DOM属性和属性(包括事件处理程序)都应该使用驼峰大小写，以与标准JavaScript风格保持一致。由于规范不一致，我们有意在这里打破规范。然而，data-*和aria-*属性符合规范，应该只小写。

你可以在这里看

我添加了一个快速的JSFiddle来使用JSX的数据属性。我知道这很乱(这是我在短时间内想出的最好的办法)。但是你可以在react中看到data属性的用法。

试着这样使用:

React.DOM.div(
{
  className: 'dropdown',
  'data-toggle': 'dropdown',
  'aria-expanded': true
})
相关文章：