Vue.js web element 'value' issue

<!doctype html>

<html>
  <head>
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
  </head>

  <body>
    <div id="app">
      <h1>Bind to 'value' property</h1>
      <b>String object:</b>
      <my-customel :value.prop="'Hello'"> </my-customel>
      <br/>

      <b>Date object:</b>
      <my-customel :value.prop="new Date()"> </my-customel>
      <br/>

      <b>Array object:</b>
      <my-customel :value.prop="[1,2,3]"> </my-customel>
      <br/>

      <b>Complex object:</b>
      <my-customel :value.prop="{ cust: 42 }"> </my-customel>

      <h1>Bind to 'cust' property</h1>
      <b>String object:</b>
      <my-customel :cust.prop="'Hello'"> </my-customel>
      <br/>

      <b>Date object:</b>
      <my-customel :cust.prop="new Date()"> </my-customel>
      <br/>

      <b>Array object:</b>
      <my-customel :cust.prop="[1,2,3]"> </my-customel>
      <br/>

      <b>Complex object:</b>
      <my-customel :cust.prop="{ cust: 42 }"> </my-customel>

    </div>

    <script src="lib/myel.js"></script>
    <script src="app.js"></script>
  </body>
</html>

{
  "plnkr": {
    "runtime": "system"
  }
}

function MyCustomElement() {
  var ret = Reflect.construct(HTMLElement, [], this.constructor);

  // Define a 'value' property
  Object.defineProperty(ret, "value", {
    set: function(v) {
      this._value = v;
      if (this.isConnected) {
        this.update();
      }
    }
  });

  // Define a 'cust' property
  Object.defineProperty(ret, "cust", {
    set: function(v) {
      this._value = v;
      if (this.isConnected) {
        this.update();
      }
    }
  });

  return ret;
}

MyCustomElement.prototype = Object.create(HTMLElement.prototype);
MyCustomElement.prototype.constructor = MyCustomElement;
Object.setPrototypeOf(MyCustomElement, HTMLElement);

MyCustomElement.prototype.connectedCallback = function() {
  this.innerHTML = `
    <div>
        Current value: <span></span><br/>
        Current type: <span></span>
    </div>`;
  this._span1 = $(this).find('span')[0];
  this._span2 = $(this).find('span')[1];
  this.update();
}

MyCustomElement.prototype.update = function() {
  // Analyze bound value type
  this._span1.textContent = JSON.stringify(this._value);
  this._span2.textContent = typeof this._value;
}

customElements.define('my-customel', MyCustomElement);

      var app = new Vue({
        el: "#app",
        data: { }
      });