javascript - 需要帮助使用某些类型的样式和 react

Question

我正在使用 React 并尝试通过我找到的 Github 帐户在我的页面上添加一个 slider 。我不知道如何添加 css 因为它是 js 形式？？？我添加了 webpack 甚至 npm 编译器，但它仍然无法识别所使用的样式类型。有什么想法吗？

    .slider {
position: relative;
width: 100%;
height: 400px;
overflow: hidden;
& a {
    &.previousButton,
    &.nextButton {
        font-size: 22px;
        line-height: 0;
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        transition: all .3s linear;
        z-index: 1;
        color: #333;
        padding: 10px;
        text-decoration: none;
        backface-visibility: hidden;
        /* prevent jump effect when scaling */
        &:not(.disabled):hover {
            transform: translateY(-50%) scale(1.25);
            cursor: pointer;
        }
    }
    &.previousButton

Answer 1

与其使用“class”或“className”，不如将其应用于您的元素，并使用 style={ theNameOfTheStyleObject}。

对于内联 js 样式，使用 style={{ }}(不是类)。

语法上的主要区别在于，您将用等效的驼峰式拼写替换带连字符的规则(使用 borderRadius 而不是 border-radius)，需要引用带有限定符 (10px) 的数值。还有，js样式是对象，所以把分号换成逗号。

我可能忘记了一些事情，所以提前道歉。

希望第一段回答了实际问题。