Question

我有一个问题，我正在努力。一些背景：用户可以在我的应用程序中选择要使用的应用程序的颜色方案，此选项存储在数据库中。

我想要做的是基于这个选择，在页面加载时，为用户选择提供CSS文件。

我一直在尝试做的是通过在_Layout.cshtml页面中执行AJAX请求来检查用户选择，并在标题中附加相应的CSS。这是有效但不是很好，因为有一些延迟，它只是不是一个好的解决方案，因为有时在加载CSS后元素的样式不正确。

我想要做的是检查服务器端，就像控制器中的普通视图一样（布局页面缺少控制器，因为你知道这就是我被困的地方）。然后在_Layout视图中添加正确的CSS。

亲爱的堆栈溢出者，你对我有什么建议可以实现吗？我的用户需要甜蜜的黑暗主题。 ;）

提前致谢！

Answer 1

创建服务

public class ThemeService
{
    private readonly MyDbContext  _dbContext;
    private readonly IMemoryCache _memoryCache;

    public ThemeService(MyDbContext dbContext, IMemoryCache memoryCache)
    {
        //Here you can also inject the UserManager<T> if needed
        _dbContext = dbContext;
        _memoryCache = memoryCache;
    }

    public string GetTheme()
    {
        throw new NotImplementedException();
    }
}

并将其注册到服务容器scoped（因为您需要DbContext）：

services.AddScoped<ThemeService, ThemeService>();

在你看来，只需注入它

@inject ThemeService ThemeService;

后来在视图中：

<link type="text/css" href="@ThemeService.GetTheme()" />

Answer 2

如果您只是有一个“黑暗”和“浅色”主题，为什么不在存储用户选择的数据库中存储bool，然后在视图的_Layout中执行类似的操作

@if(ViewBag.IsLightTheme)
{
    <link rel="stylesheet"  type="text/css" href="path.to.light.theme" />
}

else
{
    <link rel="stylesheet"  type="text/css" href="path.to.dark.theme" />
}

在控制器的构造函数中，您需要将来自数据库的值分配给ViewBag.IsLightTheme var（您可能希望在那里使用某种形式的缓存，因为这将在每个页面上调用）

如果你不只是有两个主题，你可以使用更精细的方式选择基于href或类似的东西来编写switch。

另一种选择是总是使用CSS的相同URL，它实际上指向一个控制器的操作，该控制器将执行对数据库的调用并使用{{1}基于答案返回不同的CSS }}

ASP.NET Core 2.1基于DB中的数据在布局中插入CSS

2 个答案: