1

我们有一个显示实时数据的 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中的计时器来实现这一点？

感谢您的时间。

4

1 回答 1

1

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

JS指令

完成此任务的最强大的方法是使用 DotVVM 3 @js 指令将 JS 文件链接到您的页面，然后从 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 也可以工作，但只有在您不介意页面总是刷新时才可以接受。

于 2022-01-30T18:00:50.527 回答