我正在尝试在混音项目中创建顺风指令。当我在 tailwind.css 的图层组件下创建 css 类并将其应用到 React 组件 className 时,不知怎的,我看不到样式对组件的影响。
@layer components {
.note-view-article-container {
@apply bg-gray-300 px-5 py-2 my-10;
}
.note-view-title {
@apply border border-zinc-500 text-center text-lg
}
}
下面的组件,
export function NoteView(props: Note) {
const { id, title } = props;
return (
<article className=".note-view-article-container" key={id}>
<p className=".note-view-title">
{title}
</p>
);
}
我可以做什么来解决这个问题?谢谢!
尝试使用
className="note-view-article-container"
而不是 className=".note-view-article-container"
。 如何在react中应用css样式
export function NoteView(props: Note) {
const { id, title } = props;
return (
<article className="note-view-article-container">
<p className="note-view-title">
{title}
</p>
</article>
);
}
而且,在没有看到组件的完整源代码的情况下很难推理,但很可能您不需要文章的 key 属性。