Skip to content

[vue] vue边界情况有哪些? #478

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

[vue] vue边界情况有哪些?

Activity

lovelmh13

lovelmh13 commented on Jun 28, 2019

@lovelmh13

组件递归
组件之间相互引用,A用B,B又用了A

xixileng

xixileng commented on Jul 1, 2019

@xixileng

在errorCaptured中更改组件状态,触发更新后再次报错(未设置短路条件),陷入无限循环

xjt31012

xjt31012 commented on Jul 9, 2019

@xjt31012

访问根实例、访问父组件、子组件

Yanhua67

Yanhua67 commented on Jul 31, 2019

@Yanhua67

请问一下,这个边界情况是什么意思?

callmesoul

callmesoul commented on Aug 16, 2019

@callmesoul

请问一下,这个边界情况是什么意思?

Linkontoask

Linkontoask commented on Sep 12, 2019

@Linkontoask
rinbowLi

rinbowLi commented on Feb 24, 2020

@rinbowLi

在updated钩子中改data的属性值,然后又触发更新,导致无限循环

Betty985

Betty985 commented on Apr 13, 2022

@Betty985

强制更新

如果你发现自己需要在 Vue 中强制更新,那么在 99.99% 的情况下,你已经在某个地方犯了错误。例如,你可能依赖于 Vue 响应性系统未跟踪的状态,比如在组件创建之后添加了 data 属性。

但是,如果你已经排除了上述情况,并且发现自己处于这种非常罕见的情况下,必须手动强制更新,那么你可以使用 $forceUpdate。

低级静态组件与 v-once

在 Vue 中渲染纯 HTML 元素的速度非常快,但有时你可能有一个包含很多静态内容的组件。在这些情况下,可以通过向根元素添加 v-once 指令来确保只对其求值一次,然后进行缓存
vue

Tracymcgrady946

Tracymcgrady946 commented on Sep 7, 2023

@Tracymcgrady946

异步更新问题:在 Vue 的更新过程中,数据更新是异步执行的。这意味着在修改数据后,DOM 并不会立即更新,而是在下一个事件循环中进行更新。这可能导致在修改数据后立即访问 DOM 或计算属性时,获取到的还是旧的数据。为了解决这个问题,可以使用 $nextTick 方法或侦听器来获取更新后的 DOM 或计算属性值。

数组变动检测问题:Vue 可以检测到数组变动的方法包括 push()、pop()、shift()、unshift()、splice() 和 sort()。然而,当直接通过索引修改数组元素或使用 length 属性时,Vue 无法检测到变动。为了解决这个问题,可以使用 Vue.set 或 this.$set 方法来修改数组元素,或者使用 splice() 方法来删除或添加元素。

对象属性添加问题:当给一个已经创建的 Vue 实例添加新的属性时,新属性不会触发响应式更新。这是因为 Vue 在创建实例时会将数据进行响应式转换,后续添加的属性并没有进行相同的转换。为了让新属性也具有响应式能力,可以使用 Vue.set 或 this.$set 方法。

动态属性问题:在模板中使用动态属性时,Vue 会对属性表达式进行求值。然而,某些表达式可能无法在模板编译阶段进行求值,例如使用非响应式的数据或在计算属性中使用的动态属性。为了解决这个问题,可以使用计算属性或方法来处理动态属性。

异步组件渲染问题:当使用异步组件时,可能会出现组件在渲染之前被访问的情况。这可能导致组件状态尚未准备好,或者组件还未加载完成。为了解决这个问题,可以使用异步组件的 v-if 或 v-show 来确保组件在渲染之前已经加载完成。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@callmesoul@xjt31012@xixileng@Linkontoask

        Issue actions

          [vue] vue边界情况有哪些? · Issue #478 · haizlin/fe-interview