问题标签 [glamorous]

当我输入一个不存在的 url 时，我试图呈现一个组件。但是，组件会在所有路由中保持渲染。我正在使用react-router-dom@4.1.1. 这是我设置的路线：

这是我的NotFound组件：

我目前面临的问题是消息：当我更改 URL 时，在路由上The page that you are looking is not there.不断弹出。我很难尝试仅在我转到未定义的路线时才显示该消息。最初，我尝试切换路线并在顶部制作更“详细”的路线，如下所示：//addelement

但是，它并没有解决问题。有没有办法防止消息出现在我去的每条路线上，除了未定义的路线？

我开始接触glamorous，它是一个React 组件样式模块。我有两个要设置样式的按钮：Add和Clear. 我试图将两个按钮放在同一行，Clear左侧的Add按钮和右侧的按钮。我无法在同一行上制作两个按钮。相反，Clear按钮位于按钮下方Add。这就是我所拥有的：

我尝试display: "inline"像这样添加到 Button 组件：

它没有做任何事情。接下来，我尝试将其更改为display: "inline-block"：

最后，我尝试overflow: "auto"在 Button 组件中添加：

它也没有奏效。我所有的尝试都没有对按钮做任何事情。如何将按钮放在表单上均匀分布的同一行上？

我正在尝试设置 react-router-dom NavLink 导航栏的样式。我已经采取了几种不同的方式，但在每种情况下，无论我选择哪种方式都会使 NavLink '不可点击' - 这将是一个样式精美的框，不会在点击时导航。以下是我采取的几种方法：

我尝试过的一种方法是通过点击测试制作迷人的 CSS 框。这是我想要使用的首选方法，因为它允许我设置悬停和其他伪元素的样式。我尝试了以下但没有成功。这两个华丽元素只是样式化的 div。我担心因为 navlink 被埋在 div 中，它位于元素的“下方”，所以我尝试为 Navlink 设置 zIndex=999，为 glam 元素设置 zIndex=1（以及设置相对和绝对定位） ，并且我还尝试为 glam 元素设置 pointerEvents='none'，以便您可以“点击”到导航链接。

造型：

渲染中的链接：

我尝试做的另一种方法（作为一种技巧）是在类中创建一个函数并以这种方式通过点击事件发送。这里的样式只能在 navlink 上，所以不应该有任何点击问题，但同样，点击不起作用！

功能：

和链接：

当我将 NavLinks 放在这样的样式组件中时，它的工作原理是：

但是，styled-components 对伪元素没有很好的支持（澄清： &.active 方法在上面不起作用），所以我不想使用它。有谁可以告诉我为什么我迷人的 css 示例不起作用？

我已经尝试了用于 css-in-js 的 Glamorous 库，但无法解决一件事。

使用 vanilla css，您可以轻松地为类中的所有选择器添加样式，例如：

有什么办法可以用魅力四射来实现它？例如，在这个片段中，我正在寻找一种方法来声明容器内的所有 div 都应该具有margin-right20px 的大小，而无需将其传递给每个组件：

这是工作片段的链接： https ://stackblitz.com/edit/glemorouschildselector

我想构建一个可以使用.css文件的东西，返回一个函数，该函数将采用类名数组并返回将应用于具有这些类名的元素的样式，作为 JavaScript 对象。（这样的工具适用于 Glamour、Fela 或其他 CSS-in-JS 技术。）

例如，如果你有这个 CSS 文件：

那么你可以做这样的事情：

在这个例子中，.btn-group被忽略了，因为我们只询问了哪种样式适用于.btn.primary.

这对我来说是一个新领域，但我知道那里有解析 CSS 的工具。哪些图书馆最有希望看看？（或者，这样的东西已经存在了吗？）

我正在使用Animated for web，我想知道是否可以在 Glamorous 组件中使用动画值？

喜欢：

或者像：

这个 CSS 选择器如何在 Glamorous 中工作？

我正在尝试在我正在构建的样板项目中使用 PayPal 的 Glamorous CSS-in-JS 库，该项目也利用了 TypeScript。

Glamorous 允许您向元素添加道具，如下所示：

这样您就可以像这样在 JSX 中使用该元素：

我有许多这样的道具，我想将它们添加到我所有的 Glamorous 生成的元素中。因此，我创建了一个如下所示的辅助函数：

WherespecialProps表示一个函数（如上面的那个），它将各种道具添加到我的样式声明数组中。

我打算像这样使用它：

specialProps然后，我希望为我的 JSX 使用键入由提供的所有道具。所以，我试着GBPComp像这样创建我的类型：

问题在于并非所有返回的元素都必然具有React.HTMLProps<HTMLElement>. 它们可能是HTMLAnchorElementorHTMLTableElement等​​。

我如何能够动态生成我的GBPComp类型，以便将这些道具（即layout和width）添加到所有返回的类型？这样以下内容将在 TypeScript 中正常工作：

我尝试在 react-native 中使用迷人的包。所以我使用了如下命令。

但是我遇到了错误

这是日志文件

是什么原因？有人知道原因吗？感谢您的关注。

将样式应用于第三方组件的标准方法不适用于 react-router-dom 链接。

样式使 NavLink 在反应中“不可点击”

我有以下代码，其中除 Link 之外的所有组件都已设置样式，并且必须设置样式。

当我将以下内容添加到我的样式文件时

然后导入它并用它替换 Link ......

...打字稿告诉我，“to”和“state”都不是存在的属性，因此它不会将其识别为反应路由器链接。它给出 PurchaseFooterItemLink 的类型为

我尝试了替代语法（https://github.com/paypal/glamorous/issues/145）

但这也不起作用 - 它说 withStyle 从未使用过。所以不知道该尝试什么。

通常与第三方组件类似的问题 -无法使用 Glamorous 设置第三方组件的样式

编辑：打字稿错误消息是：

当您将鼠标悬停在 PurchaseFooterItemLink 上时，它会显示如下类型，对我而言，问题是类型显示为对象而不是链接：