css 将样式有条件地添加到React组件

46scxncf 于 2023-08-08 发布在 React

关注(0)|答案(1)|浏览(140)

我正在尝试使用以下代码向React组件添加一个内联样式 prop ：

<div className="items" ref={containerRef} style={max_width !== '0px' && { maxWidth: max_width }}>

字符串
其中max_width是字符串var，containerRef是来自useRef钩子的引用。但是，添加style属性会引发以下错误：

Uncaught TypeError: n.current is null

型
我做错了什么？我使用的语法是否正确？

1条答案

为样式化应用条件的正确方法如下

<div className="items" ref={containerRef} style={{ maxWidth: max_width !== '0px' ? max_width : '' }}>

字符串
确保style值像对象{{ }}一样有双开/闭花括号。
您可以在这里找到更多信息：
Conditional inline style in react js
https://www.w3schools.com/react/react_css.asp的