javascript - 动态更改 React jsx 类,无需 DOM 操作

标签 javascript jquery html reactjs

我正在使用 jsx React 并希望动态设置一个类,同时保持另一个类静态,所以我想要像下面这样的东西来保持类 type 但有一个额外的动态类 change 更改为类 bigsmall 或其他。

<p className="type {change}">{pokeType}</p>

有没有办法在不使用 element.setAttributedocument.getElementById...className 或 jQuery 的情况下执行类似的操作?或者只能通过 DOM 操作来完成这种事情?

最佳答案

您需要在组件状态中进行更改:

this.setState({ change: 'myClass1'})

// will yield <p className="type myClass1">...</p>
<p className={`type ${this.state.change}`}>{pokeType}</p> 

this.setState({ change: 'myClass2'})

// will yield <p className="type myClass2">...</p>
<p className={`type ${this.state.change}`}>{pokeType}</p> 

关于javascript - 动态更改 React jsx 类,无需 DOM 操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39459631/

相关文章:

php - 在表单中创建黑名单过滤器以避免某些单词

javascript - React 组件不是从 bootstrap 选项卡调用的吗?

javascript - 微信分享按钮

jquery - 使用 django 1.10.5 的 Ajax Post 请求错误

javascript - jQuery ajax 不断添加越来越多的元素

javascript - 如何在响应式图像和下面的元素之间创建固定的空间量?

html - CSS 不允许边框大小为 1,它在伪元素上强制渲染大小为 3

javascript - 我在谷歌地图上有一个标记,点击后应该显示文本内容

javascript - 改变 type=submit 的值

javascript - 我如何使用jquery在5秒后淡入和淡出单词