SOURCE

//1.Vue.extend创建组件
const cpnC = Vue.extend({
    template: "#cpn1",
    props: {
        //1.类型限制
        // cgoods: Array,
        // cmessage: String

        //2.提供默认值,没传时显示
        cgoods:{
            type:Array,
            default:[]
        },
        cmessage:{
            type:String,
            default:"这里是默认值",
            required:true
        },
        //3.驼峰标识
        cTitle:{
            type:String
        }
    }
})

//2.注册组件
Vue.component('my-cpn', cpnC)

const app = new Vue({
    el: "#app",
    data: {
        message: "我是message",
        goods: ["衣服", "鞋子", "帽子", "短裤"],
        title:"我是驼峰标识"
    }
})

<div id="app">
	<my-cpn v-bind:cgoods="goods" :cmessage="message" :c-title="title"></my-cpn>
</div>

<script type="text/x-template" id="cpn1">
	<div>
        <h1>{{cTitle}}</h1>
		<h2>{{cmessage}}</h2>
		<ul>
            <li v-for="item in cgoods">{{item}}</li>
        </ul>
	</div>
</script>