vue 全局组件和局部组件

VUE 专栏收录该内容
50 篇文章 0 订阅

组件分类:全局组件 局部组件

​ 全局组件在任何地方都可以使用
​ 局部组件只能在当前实例里用

全局组件

Vue.component("组件名称",{data(){return {
​            msg:"123"}},
​    methods:{fn(){
​            console.log(this.msg)}},
​    template:`<div><span @click="fn">{{msg}}</span></div>`     【注】:只有一个根
})

局部组件

new Vue({
    el:"#app",
    component:{
        "one":{
            data(){
                return {
                    msg:"123"
                }
            },
            methods:{},
            template:`<h1>123</h1>`
        }
    }
})

组件的使用 <组件名称></组件名称>

new Vue({
​    template:"<h1>如果实例里面存在template的话,你的页面只会渲染template </h1>"
}).$mount("#app")
  • 2
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值