如何在 reactstrap 输入上应用自定义 styles？

Question

如果有人有使用 reactstrap 的经验并且可以帮助我解决问题：我有一个 reactstrap 输入组件，我想在 styles.scss 中应用“border: none”。 在他们的文档中，我没有看到 Input 组件以及可以使用的道具。 我不知道我是否可以从它的道具中应用边框：无。 到目前为止，我已经在 styles.scss 中尝试过：

.form-control {
  border: none;
}

或者

#name.form-control {
  border: none;
}

或者通过在 Input 组件上应用className={styles.inputName}属性并尝试应用上面提到的 css 属性。 到目前为止，这些都没有奏效。 谢谢你。

Answer 1

Reactstrap 或 React Bootstrap 之类的框架带有您导入的 CSS 文件。 这是一个巨大的文件，包含您需要的所有属性。 您所做的就是将 class 名称应用于您的 React 组件，如className={"classname1 classname2..."} 。

因此，对于边框，这里是文档： https://mdbootstrap.com/docs/react/utilities/borders/从该文档中您可以看到，例如，您可以通过应用此border-top-0名称边框来仅删除顶部边框- border-top-0 。 并且有一个 class 名称用于几乎所有可以想象到的正确名称，例如显示、边距、填充、宽度、高度等。