Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

forceUpdate does not update computed fields #7395

Closed
nagyzsolthun opened this issue Jan 6, 2018 · 5 comments

Comments

Projects
None yet
6 participants
@nagyzsolthun
Copy link

commented Jan 6, 2018

Version

2.5.13

Reproduction link

https://github.com/nagyzsolthun/vue-forceupdate-computed

Steps to reproduce

  1. build project
  2. open build/build.html
  3. wait 2 seconds

What is expected?

"last update time" to change

What is actually happening?

"last update time" does not change

@JounQin

This comment has been minimized.

Copy link
Contributor

commented Jan 6, 2018

https://vuejs.org/v2/api/index.html#vm-forceUpdate

As I know, forceUpdate is only used to force update UI, not for inter computed data.

See also: https://vuejs.org/v2/guide/computed.html#Computed-Caching-vs-Methods

@yyx990803

This comment has been minimized.

Copy link
Member

commented Jan 6, 2018

As @JounQin pointed out: $forceUpdate only force the view to re-render, not the computed properties. Your computed property should not contain an external non-reactive variable (time), which makes it impure.

@yyx990803 yyx990803 closed this Jan 6, 2018

@anlek

This comment has been minimized.

Copy link

commented Sep 26, 2018

@yyx990803 Any reference to how to make a updatable time work in the UI?

@subdavis subdavis referenced this issue Oct 10, 2018

Merged

Data Browser #36

@ypresto

This comment has been minimized.

Copy link

commented Dec 4, 2018

@anlek methods: are called on $forceUpdate. Move time function from computed to methods (don't forget to change time to time()) and it should work as expected.

@mannok

This comment has been minimized.

Copy link

commented Jan 30, 2019

@yyx990803 You are right. It won't recompute the properties. However, I encounter another issue today.
$forceUpdate is not updating reactive variable too!

for example:
template part: <label ref="lbl" :attr="attr">{{new Date()}}</label>
data in script part: data() { return { attr: 'foo' } }

If I update attr and the content in console by vm.$refs['lbl'].setAttribute('data-attr', 'bbb') and vm.$refs['lbl'].innerText = 'ccc'
follow by vm.$forceUpdate(), only the innerText part updated!!!

How come?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.