What should you use Vue.observable for?

Question

Vue.js

I read an article about Vue.observable here.
The article has an example.

import Vue from vue;

const state = Vue.observable({
  counter: 0,
});

export default {
  render() {
    return (
      <div>
        {state.counter}

        <button v-on:click={() => { state.counter++; }}>
          Increment counter
        </button>
      </div>
    );
  },
};

I do not quite understand how the specified increment will differ from the variable increment placed in the `data` section.
Can the new feature be used as a replacement for the Vuex bus?

Answer 1

Vue.observableallows you to create objects that are not tied to a specific component, changes in which will cause all dependent elements to be redrawn.
Roughly speaking, this is a lower level of abstraction. When you create an object in a section datasomewhere, internally Vue uses Vue.observable. It's just now that this feature has become available globally.