javascript - 页面加载后如何插入或更新 js-timestamp 组件？

Question

背景：我正在使用 SailsJS 框架来显示更新数据模型的时间戳。该框架来自他们称之为“parasails”的东西，它使用了 Vue.js。它提供了<js-timestamp :at="1573487792252">组件来显示像“几秒钟前”这样的消息，随着时间的推移会自动更新。随着时间的流逝，“time since”消息将动态更新，因此它可能会显示“5 分钟前”之类的内容。与此同时，我的项目中的底层模型可以更新，并且更新通过 WebSocket 传递给浏览器。发生这种情况时，我想更新<js-timestamp>以反映新的参考时间戳。

问题：当 HTML 首次加载时，parasails 将<js-timestamp>元素替换为<span parasails-component="js-timestamp">包含文字“自时间”消息而不是整数时间戳的元素。据推测，parasails 将该整数存储在 JavaScript 变量中。我曾尝试使用 JQuery 插入一个新的<js-timestamp>但 parasails 并没有流行起来。该标签仍保留在 DOM 中，但不会使用“time since”消息进行更新。我可以从组件的源代码中看到，当时间戳小于 24 小时时js-timestamp，它使用来获取“自时间”消息，但如果我使用它并手动替换文本，它不再自行更新moment(this.at).fromNow()随着时间流逝。

问题：更新时间戳的正确方法是什么，以便 parasails（或 Vue.js 或其他）随着时间的推移继续更新消息？

标签： javascriptvue.jssails.js

Answer 1

事实证明，我可以在与页面关联的 JavaScript 中定义一个变量，并将js-timestamp :at属性设置为变量名而不是整数文字。然后当变量更新时，页面也会更新。

而不是这个：

<js-timestamp :at="1573487792252">

我现在使用这个：

<js-timestamp :at="model.updatedAt">