SOURCE

//1.Vue.extend创建组件
const cpnC = Vue.extend({
    template: "#cpn",
    data(){
        return {
            dnumber:this.number1
        }
    },
    props:{
        number1:{
            type:Number,
            default:0
        }
    },
    methods:{
        numInput:function(event){
            this.dnumber=event.target.value
        }
    }
})

const app = new Vue({
    el: "#app",
    components:{
        'my-cpn':cpnC
    },
    data: {
        num: 1
    }
})

<div id="app">
	<my-cpn :number1="num"></my-cpn>
</div>

<script type="text/x-template" id="cpn">
	<div>
		<h2>{{dnumber}}</h2>
	    <input type="text" :value="dnumber" @input="numInput"></input>
	</div>
</script>