<div id="app">
<textarea cols="30" rows="5" v-model="val"></textarea>
<my-textarea cols="30" rows="5" v-model="val"></my-textarea>
<p>Val is: {{ val }}</p>
</div>Vue.component('my-textarea', {
props: {
value: String
},
methods: {
input: function(event) {
this.$emit('input', event.target.value)
}
},
render: function(h) {
this.$listeners.input = this.input
return h('textarea', {
attrs: this.$attrs,
on: this.$listeners,
props: this.$props
}, this.value)
}
})
new Vue({
el: '#app',
data: {
val: 'Hello, World'
}
})
External CSS
This Pen doesn't use any external CSS resources.