Vue v-model example

Simple example to show difference between v-model & v-bind in Vue

HTML

<div id='app'>
  <p>
    <span>Data Source:</span>
    <span v-text='data_source' />
  </p>
  <hr>
  <p>
    <label>v-model</label>
    <input
      type='text'
      v-model='data_source'
      placeholder='See it can change the data source'
    />
  </p>
  <p>
    <label>v-bind:value</label>
    <input
      type='text'
      v-bind:value='data_source'
      placeholder='But it can not'
    />
  </p>
</div>

Vue

new Vue({
  el: "#app",
  data: {
  	data_source: '',
  },
})