blazor组件需满足三要素：.razor扩展名、首字母大写的合法文件名、且仅一个根元素；参数必须用[parameter]标记才能触发重渲染；子内容通过renderfragment类型参数childcontent实现。
Blazor 前端开发不是“用 C# 写点 JS 替代品”，而是直接用 .NET 运行时在浏览器（WebAssembly）或服务器（Server）上执行 C# 逻辑，HTML 渲染由框架接管。只要文件名、结构、参数标记三者合规，组件写完就能用，不改 Program.cs、不注册、不手动注入。
新建 .razor 文件为什么编译报错
最常见错误是命名和根元素不合法，导致编译器无法识别为组件类型：
- 文件扩展名必须是
.razor（不是.cs、.html或.cshtml） - 文件名首字母必须大写，且符合 C# 标识符规则：如
MyCard.razor✅，my-card.razor❌、1card.razor❌ - 组件内 HTML 必须有且仅有一个根元素：
<div>、<code><section></section>、<article></article>都可以，但不能并列两个<p></p>或<div> <li>若加了 <code>@page "/my-card"，该路径不能与已有页面重复；纯复用组件（如MyButton.razor）可完全不写@page - 必需参数：直接加特性，如
[Parameter] public string Label { get; set; }，父组件未传会编译警告 - 可选参数：加默认值，如
[Parameter] public string Color { get; set; } = "primary" - 事件回调：用
EventCallback<t></t>，如[Parameter] public EventCallback<string> OnSubmit { get; set; }</string>，内部调用OnSubmit.InvokeAsync("done") - 禁止在
[Parameter]的 setter 里写业务逻辑——它可能被反复调用，且不保证执行时机；应改用OnParametersSet()生命周期方法 - 父组件需声明参数：
[Parameter] public RenderFragment ChildContent { get; set; }（注意名称必须是ChildContent才能被自动识别） - 在模板中用
@ChildContent渲染，例如：<div class="card">@ChildContent</div> - 使用时包裹任意合法内容：
<mycard><p>这是动态插入的内容</p> <mybutton>确定</mybutton></mycard> - 不支持多个具名 slot；如需多区域，得手动定义多个
RenderFragment参数，比如HeaderContent、FooterContent
[Parameter] 属性传值没反应怎么办
这是语义级陷阱：普通 C# 属性不会被框架监听，只有加了 [Parameter] 特性的属性才会触发重渲染。
前端设计优化skill
下载
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
怎么让组件接收并渲染子内容（类似 slot）
Blazor 不叫 slot，对应机制是 RenderFragment，本质是一个可执行的 UI 渲染委托。
最容易被忽略的是根元素约束和 [Parameter] 的语义强制性——它们不是可选项，而是编译器生成 ComponentBase 子类的硬性前提。哪怕只多一个空格或少一个闭合标签，都可能导致“Found multiple root elements”这类错误，而 IDE 不一定实时标红。
