在运行时从 Panel 组件更改 CssStyle 属性不起作用

Question

我试图通过按钮单击命令以编程方式从 Panel 组件更改 CssStyle 属性、'background-color'，但没有任何反应。如果我在 ViewModel Load() 方法上设置属性，则有效。页面加载后不。

DefaultViewModel class 范围：

private Panel p = new Panel();

DefaultViewModel，Load() 方法：

base.Context.View.Children.Add(p);
p.CssStyles.Add("height", "400px");
p.CssStyles.Add("width", "400px");
p.CssStyles.Add("background-color", "#c0c0c0");

按钮点击命令：

p.CssStyles.Remove("background-color");
p.CssStyles.Add("background-color", "#000fff");

有什么我忘了？

我的 dotVVM 版本是 2.2.155.0 Visual Studio 2019 .NET 框架 4.7.2

谢谢。

Answer 1

DotVVM 不会以这种方式工作，控件没有任何状态，因此在命令中操作它们没有多大意义。 DotVVM 中的控件只是 HTML 的薄包装，在第一次请求时发送给客户端。由于没有在命令上生成 HTML，因此控件的修改不会传播到浏览器（除非您在控件上使用 Postback.Update 属性）

您想将状态存储在视图模型中，然后将其数据绑定到控件。我不确定你到底想做什么，所以假设你想在某些情况下突出显示 div。标记（在 dothtml 文件中）可能如下所示：

<div Style-background-color="{value: IsHighlighted ? "#000fff" : "#c0c0c0"}">
    ...
</div>

或者如果你更喜欢使用 css class

<div Class-highlight="{value: IsHighlighted}">
    ...
</div>

相应的视图模型将只包含属性 IsHighlighted 并且您的命令将只分配 true 给它：


public bool IsHighlighted { get; set; }

public void DoSomething() {
    this.IsHighlighted = true;
}

在运行时从 Panel 组件更改 CssStyle 属性不起作用

DotVVM Change CssStyle property from a Panel component in runtime doesn't work

dotvvm

在运行时从 Panel 组件更改 CssStyle 属性 不起作用

DotVVM Change CssStyle property from a Panel component in runtime doesn't work

dotvvm

在运行时从 Panel 组件更改 CssStyle 属性不起作用