DotVVM：基于定时器的自动更新

Question

我们有一个显示实时数据的 dotvvm 应用程序。我们希望每 5 秒更新一次。它在 InitializeAsync 方法中加载：

 public override async Task PreRender()
    {
        if (!Context.IsPostBack)
            await InitializeAsync();

        await base.PreRender();
    }

这会设置在 dotHtml 中使用的 UsersTotal：

<span IncludeInPage="{value: HasUsers}">{{value: UsersTotal}}</span>

我们不想在用户单击按钮后自动刷新，而是自动刷新。所有绑定选项似乎都基于某个事件。有人知道在 DotVVM 框架内完成此任务的方法吗？或者在 javascript?

中是否有一些官方方法可以用计时器实现这个

感谢您的宝贵时间。

Answer 1

没有内置计时器组件，但有几种方法可以实现。

JS 指令

最 over-powered 实现此目的的方法是使用 DotVVM 3 @js 指令将 JS 文件 link 放入您的页面，然后从 JS 触发 NamedCommand。完整文档在这里：https://www.dotvvm.com/docs/3.0/pages/concepts/client-side-development/js-directive/call-dotvvm-from-js。 Javascript 你需要的（大致）是这样的：

export default context => {

    setInterval(function () { context.namedCommands["Refresh"]() }, 5000)

    return {
        // declare additional JS commands here
    }
}

然后使用刷新命令在页面中使用 NamedCommand 组件：

<dot:NamedCommand Name="Refresh" Command={command: RefreshData()} />

但是，您应该更喜欢对后台作业使用 staticCommand 绑定。

@service myUsersService = Full.Name.Of.MyUsersService

<dot:NamedCommand Name="Refresh" Command={staticCommand: UsersTotal = myUsersService.FetchUsersTotal()} />

隐藏按钮

虽然 @js 指令是一个强大的功能，但我想说对于您的用例，使用此命令添加一个隐藏按钮并从 JS 触发它会更简单。


<dot:Button Click={staticCommand: same as above} Visible=false ID="refreshButton" />

<dot:InlineScript>

setInternal(function () { document.getElementById("refreshButton").click() }, 5000)

</dot:InlineScript>

HTML 元标记

更简单的方法是使用<meta http-equiv="refresh" content="5" >，它会指示浏览器每 5 秒重新加载整个页面。即使没有 JS 也能工作，但只有在您不介意页面总是刷新的情况下才可以接受。

DotVVM：基于定时器的自动更新

DotVVM: Auto-update based on timer

dotvvm

JS 指令

隐藏按钮

HTML 元标记