Javascript 在React中格式化CSS属性

有人能告诉我如何格式化marginLeft值吗？我不知道如何在以这种方式声明属性时避开破折号。我尝试过很多不同的方法，但都没有成功。如果根本不可能，也请告诉我。谢谢

import React from "react";

const informationStyle = { 
  fontSize: "0.6rem",
  marginLeft: "get-spacing(small)"
};

const Information = () => (
   <span style={informationStyle}>
      <svg className="cp-icon-svg cp-icon-circle" /></svg>
   </span>
);

export default Information;

从“React”导入React；
常量informationStyle={
fontSize：“0.6雷姆”，
marginLeft:“获取间距（小）”
};
常量信息=（）=>(
);
导出默认信息；

您试图在React组件中使用Sass？我认为那是不可能的。您可以做的只是将Sass放在一个单独的Sass文件中，将其编译成css，然后将css导入到您的项目中

import './yourCssFile.css'; // Put this below your React import

const Information = () => (
   <span className="informationStyle"> // informationStyle is inside yourCssFile
      <svg className="cp-icon-svg cp-icon-circle" /></svg>
   </span>
);

import./yourCssFile.css'；//把这个放在你的下面
常量信息=（）=>(
//informationStyle在您的CSSFile中
);

---

您还可以使用Css模块，而不是导入完整的Css文件。您可以了解有关Css模块的更多信息。

MRAGINLEFT中的get spacing（小）是什么？它来自一个sass间距映射。您需要在sass中创建一个类，并使用className，而不是使用Style。此处是一个模板，用于将sass与react一起使用