有条件的v-once指令

时间:2018-12-06 16:23:31

标签: vue.js

我正在开发使用Vue的应用程序。它是一种可以编辑内容的文档编辑器。

侧边栏有一个幻灯片显示整个文档,中间的视口显示当前页面/跨页。

在具有100多个页面的大型文档中,我想限制允许Filmstrip组件进行的更新数量,因为它在调整大小时有些滞后,并且当全局时页面中的JS控制的布局都必须同时调整大小时,字段已更改等。

有一个表示文档内容的数据结构,该结构由视口和胶片中的Vue组件呈现。

我可以维护两个数据结构,并且仅在上一次用户交互后1000毫秒更新幻灯片中使用的数据结构。

但是,感觉有更好的方法。

Vue有一个名为v-once的指令,该指令看起来很有希望,但是,我无法确定是否可以有条件地设置它。

如果可以的话,我可以设置更改超时,如果在超时结束之前发生更改,则将其清除,然后暂时取消设置v-once,然后在下一个刻度上将其重新添加,以便渲染暂停。

如果有办法,我很想知道。

1 个答案:

答案 0 :(得分:1)

Proposal: Allowing v-once to accept a boolean flag很清楚,您不能动态设置v-once。还有一个示例,结合了v-ifv-once以获得所需的结果。

链接摘录

  

v-once用于静态内容。 v-once告诉编译器不要添加任何响应功能来节省CPU时间。否则,如果内容具有响应性,则无法使用任何方法来节省这种CPU时间。

希望有帮助