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


Posted in Javascript onMarch 08, 2018

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注册组件的几种方式总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一次失败的jQuery优化尝试小结
Feb 06 Javascript
早该知道的7个JavaScript技巧
Mar 27 Javascript
js QQ客服悬浮效果实现代码
Dec 12 Javascript
简单介绍JavaScript中字符串创建的基本方法
Jul 07 Javascript
JS实现按比例缩放图片的方法(附C#版代码)
Dec 08 Javascript
一篇文章掌握RequireJS常用知识
Jan 26 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
Oct 14 Javascript
关于Sequelize连接查询时inlude中model和association的区别详解
Feb 27 Javascript
vue+vux实现移动端文件上传样式
Jul 28 Javascript
解决vue无法设置滚动位置的问题
Oct 07 Javascript
使用JavaScript保存文本文件到本地的两种方法
Jan 22 Javascript
jQuery实现简单的Ajax调用功能示例
Feb 15 jQuery
Vue.js自定义事件的表单输入组件方法
Mar 08 #Javascript
layui之select的option叠加问题的解决方法
Mar 08 #Javascript
vue2.0 axios跨域并渲染的问题解决方法
Mar 08 #Javascript
解决Vue 通过下表修改数组,页面不渲染的问题
Mar 08 #Javascript
Vue.js实现图片的随意拖动方法
Mar 08 #Javascript
JS字符串去除连续或全部重复字符的实例
Mar 08 #Javascript
实战node静态文件服务器的示例代码
Mar 08 #Javascript
You might like
用PHP+java实现自动新闻滚动窗口
2006/10/09 PHP
php中变量及部分适用方法
2008/03/27 PHP
php中实现精确设置session过期时间的方法
2014/07/17 PHP
Destoon实现多表查询示例
2014/08/21 PHP
PHP框架实现WebSocket在线聊天通讯系统
2019/11/21 PHP
event.srcElement+表格应用
2006/08/29 Javascript
JQuery 插件模板 制作jquery插件的朋友可以参考下
2010/03/17 Javascript
JavaScript实现三阶幻方算法谜题解答
2014/12/29 Javascript
jQuery简单实现隐藏以及显示特效
2015/02/26 Javascript
JS实现屏蔽shift,Ctrl,alt等功能键的方法
2015/06/01 Javascript
Javascript类型系统之String字符串类型详解
2016/06/21 Javascript
Nodejs从有门道无门菜鸟起飞必看教程
2016/07/20 NodeJs
Bootstrap table学习笔记(2) 前后端分页模糊查询
2017/05/18 Javascript
layui导航栏实现代码
2017/05/19 Javascript
详解vue.js下引入百度地图jsApi的两种方法
2018/07/27 Javascript
js实现每日签到功能
2018/11/29 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
2019/06/21 Javascript
Angular 中使用 FineReport不显示报表直接打印预览
2019/08/21 Javascript
原生js实现无缝轮播图效果
2021/01/28 Javascript
python使用urllib2模块获取gravatar头像实例
2013/12/18 Python
Python RuntimeError: thread.__init__() not called解决方法
2015/04/28 Python
python Web开发你要理解的WSGI &amp; uwsgi详解
2018/08/01 Python
为什么Python中没有&quot;a++&quot;这种写法
2018/11/27 Python
对python csv模块配置分隔符和引用符详解
2018/12/12 Python
Python实现查找数组中任意第k大的数字算法示例
2019/01/23 Python
解决Django中多条件查询的问题
2019/07/18 Python
关于pymysql模块的使用以及代码详解
2019/09/01 Python
详解python 降级到3.6终极解决方案
2020/02/06 Python
html5响应式开发自动计算fontSize的方法
2020/01/13 HTML / CSS
高级Java程序员面试题
2016/06/23 面试题
文明倡议书范文
2014/04/15 职场文书
小学二年级学生评语
2014/04/21 职场文书
国庆庆典邀请函
2015/02/02 职场文书
教师师德工作总结2015
2015/07/22 职场文书
JS Object构造函数之Object.freeze
2021/04/28 Javascript
Mysql中的触发器定义及语法介绍
2022/06/25 MySQL