Vue组件定义

最新推荐文章于 2023-10-01 11:06:17 发布

Jack凯

最新推荐文章于 2023-10-01 11:06:17 发布

阅读量271

点赞数 1

分类专栏： Vue 文章标签： Vue组件定义 Vue

本文链接：https://blog.csdn.net/huakaidaojia/article/details/80704467

版权

Vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

局部组件定义

// 1. 定义组件
let login = {
    template: "<h1>对象字面量创建</h1>"
}

// 2. 在Vue中创建实例
let vm = new Vue({
    el: "#box",
    compoents: {
        // 原始版
        "str": login
        // 简化版
        login
    }
})

// 3. 在html结构中添加组件
<div id = "box">
    <login></login>  // 对象字面量创建
</div>

全局组件定义

// 1. 使用component在全局注册一个模板, 第一个参数组件名, 第二个参数组件内容
Vue.component("a", {
    template: // 输出的内容
});
    
// 2. 指定区域
let vm = new Vue({
   el: "#box" 
});

// 3. 页面添加
<div id = "box"><a></a></div>