[Vuejs]-How can i create a custom component that can give v-model attribute

I don’t know if this what you need but here is my take on v-model for a component

const smart_input = Vue.component('smart-input', {
    template: `
    <div>
    <input :dir="direction"  ref="inputref" :value="value" v-on:input="UpdateParent">  
      <button @click="Changeinfo">Parent Change</button>
    </div>
    `,
    props:{value:null},
    computed: {
        direction(){
            let firstChar = this.value[0];
            return firstChar === undefined || firstChar.match(/[A-Za-z]/) !== null ? 'ltr' : 'rtl'
        }
    },
    methods:{
    UpdateParent:function(event){
        this.$emit('input', event.target.value)
    },
    Changeinfo:function(){
        this.$emit('input', 'changed')
    }
    }

})

new Vue({
  el: '#app',
  components:{smart_input},
  data(){
    return{
        infomation:"test"
    }
  },
  methods:{
        TestVmodel:function(){
        this.infomation = "parent";
    }
  }  
})

This offers two-way binding like v-model

https://jsfiddle.net/50wL7mdz/407158/