欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue组件不显示问题

程序员文章站 2022-05-26 11:12:08
...

Vue组件不显示问题

刚开始按照vue.js的文档学习,自动写代码时发现了完全按照官网的例子写的代码,但是浏览器就是显示不出来,找了半天才发现是因为没有创建Vue的实例,废话不多说直接上代码。

<body>
	<div id="app">
        <button-counter></button-counter>
    </div>
	<script>
        Vue.component('button-counter',{
            data:function(){
                return {
                    count:0`在这里插入代码片`
                }
            },
            template: '<button @click="count++">点我把 {{count}}</button>'
        })
	</script>
</body>

开始我的代码是这样的,浏览器上一直没显示组件,原因是没有创建Vue的实例,在组件下面创建Vue实例即可

		var vm = new Vue({
            el: "#app"
        })

注意:Vue的实例创建必须在组件下方,否则组件依然无法显示