vue局部组件如何使用

vue的局部组件使用，需要先声明一个组件，然后挂载到全局组件的components,再使用。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="node_modules/vue/dist/vue.js"></script>
	</head>
	<body>
		<div id="app">
               <Vheader/>
		</div>
        <script type="text/javascript">
           var Vheader={
             template:`
             <div @click="handerFn">头部</div>
             `,
             data(){
                 return{

                 }
             },
             methods:{
                handerFn(){
                    alert("123")
                }
             }
           }
			var vm=new Vue({
				el:"#app",
				data(){
					return{
						

					}
				},
				methods:{
					
					
				},
                components:{
                    Vheader
                }
			})
		</script>
	</body>
</html>
posted @ 2019-04-02 16:07  lxystar  阅读(941)  评论(0)  编辑  收藏  举报