当前位置: 首页 > 文档资料 > Vue.js 教程 >

7.12.3 vm.$forceUpdate

优质
小牛编辑
137浏览
2023-12-01
  • 参数:
  • {Function} [callback]

  • 用法:

    将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样,不同的是回调的 this 自动绑定到调用它的实例上。

    2.1.0 起新增:如果没有提供回调且在支持 Promise 的环境中,则返回一个 Promise。请注意 Vue 不自带 Promise 的 polyfill,所以如果你的目标浏览器不是原生支持 Promise (IE:你们都看我干嘛),你得自行 polyfill。

  • 示例:
    new Vue({
      // ...
      methods: {
        // ...
        example: function () {
          // 修改数据
          this.message = 'changed'
          // DOM 还没有更新
          this.$nextTick(function () {
            // DOM 现在更新了
            // `this` 绑定到当前实例
            this.doSomethingElse()
          })
        }
      }
    })

最后更新:

类似资料

  • 问题内容: Facebook React 鼓励您将可变()和不可变()状态分开: 尝试使尽可能多的组件保持无状态。通过这样做,您可以将状态隔离到最逻辑的位置,并最大程度地减少冗余,从而使推理应用程序更加容易。 当状态更改时,应该调用触发虚拟DOM diff,这仅在需要时才引起真正的DOM更新。 有 是 一种方法来触发DOM更新手动调用,但它是灰心: 通常情况下 ,你应该尽量避免的所有使用和只读,并

  • 问题内容: 在 不 覆盖shouldComponentUpdate 的组件中,forceUpdate和setState之间是否有任何区别? 更新:我已经知道文档说了什么,不建议使用forceUpdate来做到这一点。我只是想加深对正在发生的事情的了解。我想知道为什么吗?而且我已经知道setState将传递的对象(状态“ delta”(类似于SQL更新))与当前状态对象合并。 假设有一个简单的用例:

  • 我正在使用React构建一个web应用程序,它将在用户每次单击按钮时显示不同的报价。我一直在寻找一种方法,让组件在单击按钮时重新呈现/刷新,我尝试了本文中介绍的所有可能性,但都没有成功。 即使创建运行或的单独函数,并使用调用该函数,也不起作用;我想我一定是执行错了什么。有没有人知道我的错误在哪里?

  • Facebook React鼓励您将可变()和不可变()状态分开: 尽量让您的组件尽可能多的无状态。通过这样做,您可以将状态隔离到最符合逻辑的位置,并最大限度地减少冗余,从而更容易对应用程序进行推理。 当状态改变时,您应该调用来触发虚拟DOM diff,只有在需要时才会导致真正的DOM更新。 有一种方法可以通过调用手动触发DOM更新,但不鼓励: 通常情况下,您应该尽量避免使用,并且只从和中的读取。

  • Update:这里是带有共享状态示例的CodeSandBox.io链接,它使用类组件,我希望在不复制状态或使用虚假状态更新的情况下将这些组件转换为钩子。

  • 迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件。

相关阅读