title: How to make Fabric js reactive using Vue js?
body: <p>I am new in Vue js. So I am trying to do some practice using Fabric js and Vue js. I try to make my canvas reactive by using Vus js but nothing happens.
  By default in canvas, it displays "Text". Then after a button is clicked that text most change into "Test bus". But text in a canva is not change.</p>
  
  <p><strong>main.js</strong></p>
  
  <pre><code>import Vue from 'vue'
  import App from './App.vue'
  import { fabric } from 'fabric'
  import { eventBus } from './bus';
  
  var vm = new Vue({
    el: '#app',
    data: {
      showText: 'Test'
    },
    render: h =&gt; h(App),
    mounted() {
      var canvas = new fabric.Canvas('canvas', {
        width: 500,
        height: 500
      });
      eventBus.$on('grabData', (gg) =&gt; {
        this.showText = gg;
      });
      var addtext = new fabric.Textbox(this.showText, {
        left: 200,
        top: 200,
        fill: "#A7A9AC",
        strokeWidth: 2,
        fontFamily: 'Arial'
          });
        canvas.add(addtext);
        canvas.renderAll();
    }
  });
  </code></pre>
  
  <p><strong>bus.js</strong></p>
  
  <pre><code>import Vue from 'vue';
  export const eventBus = new Vue();
  </code></pre>
  
  <p><strong>App.vue</strong></p>
  
  <pre><code>&lt;template&gt;
    &lt;div id="app"&gt;
      &lt;canvas id="canvas" :style="myStyle"&gt;&lt;/canvas&gt;
      &lt;button @click="changeName()"&gt;Change&lt;/button&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { eventBus } from './bus';
  
  export default {
    name: 'app',
    data () {
      return {
      }
    },
    methods: {
      changeName() {
        eventBus.$emit('grabData', "Test bus");
      }
    },
    computed: {
      myStyle() {
        return {
          border: '1px solid black'
        }
  
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>Main.js contain a default text(Test) on showText variable. Its value is changed to the event bus through App.vue. And App.vue contain a button which helps to change the value of showText. When I click the button then Value only change in a showText variable but in a canvas.</p>