vue 混入 继承浅淡

146 篇文章 5 订阅

一声叹息,天天增删改查,来吧。

什么是混入mixin

  • 将多个vue文件内重复使用的功能代码,提取成单个js文件,在需要使用的地方进行调用即可。
  • 在一个js文件内定义一个对象, 在对象中可以写 vue文件内的 data 、methods、components等所有<script>中可以定义的代码。

混入注意(重名情况)
组件中的 data变量名 和 混入中的 data变量 名, 发生重名时, 以组件为准;
组件中的 methods,computed,wath名称 和 混入中的 methods,computed,wath名称, 发生重名时, 以组件为准;
组件中的 生命钩子函数 和 混入中的 生命钩子函数 名, 发生重名时, 都会执行, 但是组件中的钩子函数优先执行 ;

Vue的生命钩子函数

 局部混入

什么是局部混入,放图

 全局混入

1.定义及全局注册

2.调用

 

 什么是继承

  • 注意:这里是不适合多继承的,多继承问题出现会多。
  • extends除了可以继承 .vue 文件,而且可以和 mixin一样使用 js文件内的对象。
  • extends继承 .vue 文件内的 template内的html是无法继承的

 

混入和继承的区别

  • 先看看官方文档的定义, 其实两个都可以理解为继承;
  • mixins接收对象数组(可理解为多继承);
  • extends接收的是对象或函数(可理解为单继承)。
  • 注意: 如果一个组件, 既使用 继承, 又使用 混入, 它们二者中如果有重名, 则混入会覆盖继承
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值