问题标签 [jss]

我在我的应用程序上使用 react-select 组件。我也只是用 JSS 设计我的应用程序。我的问题是，由于 react-select 是一个 npm 包，因此我无法修改组件中的类名。所以那里有一个输入，我需要以我的风格为目标。

我的 JSS 有点像这样：

我需要在 JSS 中做什么来设置子输入标签的样式？

我正在使用Material UI 下一个分支我想使用表格组件并且我想更改TableHead组件的样式。

我的想法是用 MyTableHead 包装 TableHead 并添加我自己的样式来覆盖当前样式。

我的代码（基于此组合）：

这不起作用：
1. 我的样式被原始样式覆盖
2. 我在浏览器 js 控制台中收到错误：

警告：未知道具sheet，classes在标签上。从元素中移除这些道具。详情请看 https://facebook.github.io/react/warnings/unknown-prop.html in thead (created by TableHead) in TableHead (at table.js:15) in _MyTableHead (created by Jss(_MyTableHead))

我想我做得不对，有什么想法吗？

我有一个反应组件。比方说 Todo

我想用酶测试它。它有两个问题。

1. 访问状态 （和其他组件特定功能）

当我shallow或mount套件中的那个作曲家时，我当然无法访问它的状态，因为它不再是我的组件，而是围绕它的一些新东西。

例如，这段代码会给我一个错误：

它说当然TypeError: Cannot read property 'length' of undefined是因为状态不是我所期望的，但这是：{ theme: {}, dynamicSheet: undefined }

这也不会让我访问props等refs。

2. 主题提供者的问题

要为项目提供一些默认颜色，如下所示：

当然，在运行测试时它会给我一个错误[undefined] Please use ThemeProvider to be able to use WithTheme。

所以我的问题如下。有没有办法在“一个地方”解决这个问题。我怎样才能让酶不知道我的组件是用什么包裹的？

如果没有，那么如果将 ThemeProvider 功能传递给我正在测试的组件，我该如何解决这个问题？以及如何访问被包装组件的 state、ref、props 和其他东西？

谢谢！

我想要这个使用 jss 样式。

试试 1

制定规则c并将类添加到a两者b

试试 2

制作一个对象common并将它们合并到两者a并b规则

有没有更好的方法？

我在下面附上了 SCSS 和反应元素的代码

我需要一些帮助来将此代码转换为 JSS

我有一个<Section>组件：

还有一个<Button>组件：

基本上，我想在<Button>里面使用<Section>而不是覆盖它的颜色。

我不能使用& a:not($button)，因为它在不同的组件中。

我有一个使用 withStyles 包装的 Drawer 组件，并覆盖了 anchorLeft 类名上的一些值。 <Drawer anchor="left" classes={{paper: this.props.classes.paper, anchorLeft: this.props.classes.anchorLeft}} ...>

我有一些应用程序的其他部分可以影响top需要传递给的值anchorLeft。我正在使用 redux，因此顶部值通过 redux 存储传递并通过道具发送到我的 Drawer 组件，因此我需要在组件中使用一种方法来影响 anchorLeft 顶部值。

在组件内部进行动态样式设置并更改 JSS 样式表中的值的首选方法是什么？有没有办法使用 JSS sheet.update() 并以这种方式访问​​工作表？http://cssinjs.org/json-api?v=v9.0.0-pre.3#function-values

使用css-in-js方法给一个react组件添加类，如何添加多个组件？

这是类变量：

这是我使用它的方式：

上面的方法有效，但是有没有办法在不使用classNamesnpm 包的情况下添加这两个类？就像是：

我正在尝试集成一个非常简单的悬停效果（光标指针浏览器标准行为）以在预先存在的 React-Typescript 项目中启动。

我研究了各种方法来做到这一点，因为 React 没有提供开箱即用的 CSS 悬停样式和内联样式，并且已经决定使用 JSS。

在我package.json的依赖项文件中，我拥有"react-jss": "^7.0.2"和"jss-preset-default": "^3.0.0"

在我拥有的相关 React-Typescript .tsx 文件import jss from 'jss'; 中import preset from 'jss-preset-default'

为了实现，我遵循了这里的示例：https://github.com/cssinjs/jss但我还有很多其他代码，这些代码是我从该文件中的另一个开发人员那里继承的（我希望它们不会以某种方式发生冲突）。

终端或浏览器控制台中没有错误。编辑器内置的 React/typescript linter 也没有错误。

我唯一能想到的是，这与我className在 JSX 中的使用有关，奇怪的是在他们用作标准 HTML 中的标准类的 jss github doc 中。

下面是完整的代码：

我对这种技术组合很陌生：React/Typescript/Material UI。

我只发现了一个关于在 Material-UI 中使用悬停的类似问题，但语法完全不同，因为 React 代码没有使用 Typescript。您可以在这里找到：Overriding with classes in material-ui v1.0.0-beta-1 显示“提供给 classes 属性的键未实现”警告

我试图找出一种方法来使用它对 JSS 的内置支持将悬停属性添加到 Material-UI 纸质组件。

我得到的错误是：Material-UI: the key .Component-root-199:hover provided to the classes property object is not implemented in Paper. You can only overrides one of the following: root,rounded,shadow0,shadow1,shadow2,shadow3,shadow4,shadow5,shadow6,shadow7,shadow8,shadow9,shadow10,shadow11,shadow12,shadow13,shadow14,shadow15,shadow16,shadow17,shadow18,shadow19,shadow20,shadow21,shadow22,shadow23,shadow24

这是我的代码：