对显示“无效属性值”的 Material UI 图标进行转换（React）答案

【问题标题】：Transform on Material UI Icon showing "Invalid property value" (React)对显示“无效属性值”的 Material UI 图标进行转换（React）
【发布时间】：2021-03-04 06:18:53
【问题描述】：

尝试从Material UI中获取一个样式正确的Icon翻转180度，CSS代码如下：

sortIconDescending: {
    transform: [{ rotate: "180deg"}],
    cursor: 'pointer',
    marginLeft: 5,
},

由于某种原因，当此类应用于图标时，它会拒绝应用的transform 属性：

><!> ̶t̶r̶a̶n̶s̶f̶o̶r̶m̶:̶ ̶[̶o̶b̶j̶e̶c̶t̶ ̶O̶b̶j̶e̶c̶t̶]̶;̶ - Err: Invalid property value

我在这里做错了什么？

【问题讨论】：

你尝试过变换吗：{rotate:'180deg'}
@Near，是的，不幸的是它不起作用。感谢您的回复

标签： css reactjs styles

【解决方案1】：

我找到了一个有效的解决方案，而不是将 transform: 属性值应用为包含对象 [{rotate: "180deg"}] 的数组，您只需编写以下代码：

sortIconDescending: {
    transform: "rotate(180deg)",
    cursor: 'pointer',
    marginLeft: 5,
},

这似乎是最好的解决方案。

【讨论】：