Vue

by Hoàng Phương Trương

HTML

<div id="app">
  <input v-model="values[0]" @paste.prevent="onPaste"/>
  <input v-model="values[1]"/>
  <input v-model="values[2]"/>
  <input v-model="values[3]"/>
  <input v-model="values[4]"/>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

input {
  display: block;
  margin-bottom: 5px;
}

Vue

new Vue({
  el: "#app",
  data: () => ({
  	values: []
  }),
  methods: {
  	onPaste: function (event) {
    	const values = event.clipboardData.getData('Text').split(/\s/)
    	this.values = [
      	...values,
        ...this.values.splice(values.length)
      ]
      console.log(this.values)
    }
  }
})