vue注册组件的几种方式总结

 更新时间:2018年03月08日 16:19:00   作者:Jiang--Z  
下面小编就为大家分享一篇vue注册组件的几种方式总结,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

1、全局注册(这种方式注册组件必须在vue实例化之前声明)

Vue.component('tag-name',{})

2、局部注册

var Child = {
 template: '<div>A custom component!</div>'
}
new Vue({
 // ...
 components: {
 // <my-component> 将只在父模板可用
 'my-component': Child
 }
})

3、扩展实例

// 定义一个混合对象
var myMixin = {
 created: function () {
 this.hello()
 },
 methods: {
 hello: function () {
  console.log('hello from mixin!')
 }
 }
}
// 定义一个使用混合对象的组件
var Component = Vue.extend({
 mixins: [myMixin]
})
var component = new Component() // -> "hello from mixin!"

以上这篇vue注册组件的几种方式总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • element table 数据量大页面卡顿的解决

    element table 数据量大页面卡顿的解决

    这篇文章主要介绍了element table 数据量大页面卡顿的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-01-01
  • vue3+ElementPlus使用lang="ts"报Unexpected token错误的解决办法

    vue3+ElementPlus使用lang="ts"报Unexpected token错误的解决

    最近开发中遇到了些问题,跟大家分享下,这篇文章主要给大家介绍了关于vue3+ElementPlus使用lang="ts"报Unexpected token错误的解决办法,需要的朋友可以参考下
    2023-01-01
  • 如何解决ElementPlus的el-table底白线问题

    如何解决ElementPlus的el-table底白线问题

    这篇文章主要介绍了如何解决ElementPlus的el-table底白线问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • ant design中upload组件上传大文件,显示进度条进度的实例

    ant design中upload组件上传大文件,显示进度条进度的实例

    这篇文章主要介绍了ant design中upload组件上传大文件,显示进度条进度的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-10-10
  • vue项目打包后部署到服务器的详细步骤

    vue项目打包后部署到服务器的详细步骤

    这篇文章主要介绍了vue项目打包后部署到服务器,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-09-09
  • 详解vue渲染函数render的使用

    详解vue渲染函数render的使用

    本篇文章主要介绍了vue渲染函数render的使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-12-12
  • vue前端页面数据加载添加loading效果的实现

    vue前端页面数据加载添加loading效果的实现

    这篇文章主要介绍了vue前端页面数据加载添加loading效果的实现方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-07-07
  • vue轮播图插件vue-awesome-swiper的使用代码实例

    vue轮播图插件vue-awesome-swiper的使用代码实例

    本篇文章主要介绍了vue轮播图插件vue-awesome-swiper的使用代码实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • vue2.0项目集成Cesium的实现方法

    vue2.0项目集成Cesium的实现方法

    这篇文章主要介绍了vue2.0项目集成Cesium的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-07-07
  • vue使用codemirror的两种用法

    vue使用codemirror的两种用法

    这篇文章主要介绍了在vue里使用codemirror的两种用法,每种方法通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-08-08

最新评论