Question

我正在使用Grid组件并拥有一个cellRenderer。在其中我尝试将backgroundColor样式添加到外部div。

customColumnRenderer(props: GridCellProps): React.ReactNode {  
    ...
      props.style.backgroundColor = "hotpink";
    ...
      return <div style={props.style} 
    ... </div>;   
}

一开始一切都很好，但后来我垂直滚动了一下，我得到了这个例外：

Uncaught TypeError: Cannot assign to read only property 'backgroundColor' of object '#<Object>'

当我查看调试器时。 props.style对我来说看起来像一个简单的对象。医生说＆＃34;您可以根据需要添加其他类名称或样式属性。＆＃34;

对我可能做错了什么的想法？

Answer 1

我能想到的最佳解决方法是使用spread运算符合并来自不同对象的样式道具。像这样：

customColumnRenderer(props: GridCellProps): React.ReactNode {  
    ...
      let myStyles = {backgroundColor: "hotpink"};
      let styles = {...props.style, ...myStyles};
    ...
      return <div style={styles} 
    ... </div>;   
}

react-virtualized Grid.cellRenderer - 发布添加样式prop

1 个答案: