[Vuejs]-Previous and current data in Vue life hooks

by

0👍

Well, In Vue official docs, They mentioned as below:

updated Hook

The component’s DOM will have been updated when this hook is called, so you can perform DOM-dependent operations here. However, in most cases, you should avoid changing the state inside the hook. To react to state changes, it’s usually better to use a computed property or watcher instead.

Hope this helps!

0👍

I could write smth like this:

{
  name: "list",
  props: ["elements"],
  data() {
    return {
      // scrollBottom no needs here
    };
  },
  methods: {
     scrollToBottom() {        
       window.scroll(0, this.$root.$el.scrollHeight); /* full window / app height list*/
    }
  },
  watch: {
    elements(current, prev) {
      if (current.length > prev.length)
         this.scrollToBottom();
    }
  }
}

In watch method use scrollToBottom directly

Leave a comment