是否可以创建一个具有预定结构并可以动态设置元素的选项的 React 样式组件？
最近我在 React 中进行了大量的样式化组件工作。一开始，我为每个元素创建了一个组件，例如一个名为“Button.tsx”的文件。在这种情况下，该文件将返回一个样式按钮。 我最近注意到创建样式组件可能非常耗时，而且根据我的说法，它也变成了很多“不必要的”代码。 如果能够创建一个名为 "Component.tsx" 的文件来代替返回样式化组件，那就太棒了。这会节省大量时间，并且还会使一个文件而不是一堆文件看起来很混乱。我已经尝试过了，它的效果就像我想要的那样（几乎）。 我现在遇到的问题是样式化组件会被 React 重新渲染，因为它是在函数内部调用的。一个简单的解决方法是将样式组件移到函数之外，但这样它就不会跟踪传入的参数，而样式组件需要知道它应该渲染哪个元素。我不知道。这可能吗？我将附上一个/一些屏幕截图。 可重用样式组件
I have been working a lot with styled components in React recently. In the beginning I created a component for each element, so for example a file called "Button.tsx". In this case, this file would return a styled button.
I have noticed lately that creating a styled component can be time consuming and it also becomes a lot of "unecessary" code according to me.
It would have been awesome if it was possible to create one file called "Component.tsx" instead that returns a styled component. This would save a lot of time and would also make one file look messy instead of a bunch of files. I have tried this and it works just like i want to (almost).
The problem I am having right now is that the styled component gets rerendered by React since it is called inside of a function. An easy fix would be to just move the styled component outside of the function but that way it wont keep track of the argument that is passed in which is necessary for the styled component to know which element it should render. I don't know. Would this be possible? I'll attach a/some screenshot/screenshots. Reusable styled component
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论