SxThemeProvider (主题提供者)
- Implemented
跨平台主题运行时桥接组件。将 C# 的 ThemeState 和 LocaleState 同步到 CSS 变量，确保 Blazor 与纯 HTML 页面共享同一套主题系统。
使用场景
- App 根组件主题初始化
- 主题/语言状态同步
- Web 与原生统一主题
约束说明
- 该组件应只放置一次，并位于应用根组件（如
App.razor或MainLayout.razor）。 - 如需同步状态，确保
IThemeState/ILocaleState已注册到 DI。
行为说明
- 首次渲染加载
theme-runtime.js并初始化主题变量。 - 若提供
ThemeState/LocaleState，将其作为 CSS 变量的来源。
API
Parameters
| 状态 | 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|---|
| Implemented | ThemeState |
IThemeState? |
null |
主题状态服务。 |
| Implemented | LocaleState |
ILocaleState? |
null |
语言状态服务。 |
| Implemented | Id (继承) |
string? |
null |
组件的物理 Id。 |
| Implemented | Class (继承) |
string? |
null |
自定义 CSS 类名。 |
| Implemented | Style (继承) |
string? |
null |
自定义样式。 |
| Implemented | Title (继承) |
string? |
null |
HTML title 属性。 |
| Implemented | Disabled (继承) |
bool |
false |
禁用状态。 |
| Implemented | AdditionalAttributes (继承) |
IEnumerable<KeyValuePair<string, object>>? |
null |
捕获不匹配的 HTML 属性。 |
示例
<SxThemeProvider />
@inject IThemeState ThemeState
@inject ILocaleState LocaleState
<SxThemeProvider ThemeState="@ThemeState" LocaleState="@LocaleState" />