I'm encountering an 'undefined' message after binding 'tooltip' prop in '' element. I want simply to show tooltip messages on required input fields.

full code: https://jsfiddle.net/8gaysr9u/

in line 16th appending v-bind:tooltip="tooltip" at

<label>SKU<input type="text" id="sku" v-model="this.product.sku" placeholder="ID"></label><tooltips v-bind:tooltip="tooltip"/>

and in line 122th appending v-bind:tooltip="tooltip">{{tooltip.tooltipText.onSubmit}}

<div class="tooltip">
  <span class="tooltiptext" v-bind:tooltip="tooltip">{{tooltip.tooltipText.onSubmit}}</span>
</div> 

the console simply thows 'undefined'. I variated the code in all ways but like against the brick wall the console throws 'undefined'. What I am doing wrong here??