问题标签 [jss]

我是使用 JSS 的新手，但由于我们正在使用 Material UI 构建我们当前的项目，我想我会尝试使用 JSS 和我必须偶尔为应用程序构建的自定义组件来遵循他们的样式 API。

在这种情况下，我可以让样式正常工作，但是，这个特定的组件具有backgroundUrl从传入的道具设置的动态，我试图弄清楚我应该如何以某种方式将传入的类与新的类合并backgroundUrl我需要动态设置的样式...

款式

组件

目前，它是一个样式标签，但是当我应用该类时它会被剥离，我该如何合并这些？

我在遵循有关如何使其工作的文档时遇到了一些麻烦

我有一个创建了一些样式的组件，在大多数情况下，所有这些样式都将适用于呈现该组件的任何位置，但有时取决于应用程序被路由到的页面，我会想要更改组件的整体高度那些页面。我想我可以通过传递某种新的高度道具来遵循更以主题为中心的方法来做到这一点。我如何让它与我当前的设置一起使用？

样式文件

组件文件

然后当我渲染它时，我描绘了这样的东西

但是，当我尝试通过控制台注销主题时，将主题传递给样式生成器时，我看不到主题进入。

我已经Material UI安装并且整个应用程序都包含在它的MuiThemeProvider

这就是我实际看到的材料主题，而不是我自己在其中的任何地方合并的主题。

我正在使用jss和TransitionGroup。如何在 jss 中设置 step-enter-active 类？

css

当前的jss

我有这样的html结构。

和 2 个组件

HeaderNavItem.jsx

导航链接.jsx

但背景仍然是蓝色的。我在浏览器控制台中收到警告：

警告：[JSS] 在 HeaderNavItem 中找不到引用的规则 NavLink。

我究竟做错了什么？

我在我的 React 项目中使用 JSS，遇到了奇怪的问题，我觉得很难解决。基本上我编写媒体查询，当我缩小我的桌面浏览器时会触发它。虽然在使用设备工具栏时，它似乎不起作用。当设备“宽度”小于 600 像素时，我试图隐藏跨度。任何帮助将不胜感激。

这是代码：

试图将一些代码从 jss 移植到 styled-components，jss 代码看起来像：

我的问题是实现跨多个组件共享相同样式的惯用方式是什么？

我正在使用 React Material UI -> TextField组件，我想围绕它制作一些包装器，并可以覆盖样式。根据文档，我们有 2 个 props 来实现这一点： 1) InputProps - 这里我们应该将类传递给作为 TextField 核心的内部Input组件。2) 直接应用于 TextField 的直接类属性。并且这些类应该包含FormControl的规则

（听起来很难，实际上是在使用 Material UI 时 =)）

无论如何，我想做这样的事情

在这里，我希望有可能将整个对象传递给我的 2 个目标。输入和表单控件。但这是主要问题，我不知道如何解决。看起来 JSS（与 MaterialUi 中的 withStyles 相同）不适用于包含规则的嵌套容器的对象。

我通过这种丑陋的方式完成了这项任务。它看起来像地狱，但我没有找到任何方法来避免它。有人可以帮我吗？真的只有一种方法可以满足这个要求吗？

因为我想要实现的方式为我们提供了灵活性，我们可以随时添加我们想要的任何类，而在第二种方式（如下）我们必须在开始时硬编码所有可能的类

顺便提一句。我想提供一种机制来从外部应用程序更改组件的样式，这就是为什么我不能在输出中使用 CSS，因为它应该是有效的 commonJS 模块。

我正在尝试在带有 JSS 的反应组件中为悬停样式使用函数值（我正在使用 styled-jss 库）。我只希望在“已编辑”道具为真时应用悬停样式。目前对于悬停部分，我有这个：

这很好用，但正如你所见，我必须对每个悬停 CSS 值进行函数值检查。我只想在开始时进行一次检查，如果为真则返回对象：

但是这种语法或类似的东西似乎不受支持，我在任何地方都找不到任何例子。有没有一种简单的方法可以做到这一点？还是我只需要对悬停对象中的每个属性进行函数值检查？

编辑：

这是我的样式化组件及其 JSS 以及我如何使用它们的基本通用示例：

然后在我的反应组件中：

我正在通过 react-jss 使用 jss。假设我有一个定义了基色的主题。然后我想在这个主题中定义一个默认边框，参考基色。

我还没有找到这个的语法。不可能吗？我是否必须在外面定义颜色并在两个地方都使用它？

我正在使用 mobx-react，并结合 react-jss 库进行样式设置。

我面临的问题是商店更新不会导致样式定义中的函数使用新道具执行 确切的场景可以在这里复制 https://codesandbox.io/s/2wkw6m75kj

观察 -

• 我首先使用react-jss的injectSheet方法注入样式，然后是 mobx 商店注入。以这种方式，商店可用作样式规则的道具（需要在道具更新时动态更新样式），在商店更新时，组件正在重新渲染，但样式功能未执行。
• 我尝试使用 mobx 和 react-jss 的注入函数作为装饰器而不是函数，它会导致相同的行为。

使用的 Mobx 版本 - 3.5.1 使用的 Mobx-react 版本 - 使用的 4.4.2 React-jss 版本 - 8.4.0 浏览器 - Electron 1.8.2

我想知道，如果我能做些什么来解决这个问题，或者我自己做错了什么？