写在前面
本文只针对使用vue技术栈,进行讨论。
正文
使用vue技术栈开发,难免会使用第三库,这大大提高了我们开发的效率。然而,这是第三方库有bug怎么办?
既然有bug,就是现有功能没有达到预想效果。除了,等作者更新之外有没有其他方法解决? 作为有作为的青年,当然不能坐以待毙咯。
第一步
阅读第三方库源码,怎么阅读这里就不要展开。 阅读源码,找不问题所在。
第二部
找到了问题所在,怎么解决,给作者提bug?
恩~ 这个想法不错。但是,我们其他办法解决。
既然代码存在bug,我们可以重写有bug的代码。
没有错,就是重写代码。vue在提供了extends和mixins提供重写代码的方式。关于extends和mixins可以阅读之前的一篇文章:vue mixins和extends的妙用。
举个例子:使用mint-ui Swipe组件过程中发现存在的bug
import {Swipe
} from 'mint-ui'
export default {components: {imageSwipe: {extends: Swipe,watch: {defaultIndex (val) {this.reInitPages()}}}}}
上面代码的做法就是,定义一个imageSwipe,继承mint-ui的Swipe组件,加一个watcher。
这时候使用imageSwipe时,props、event和slots与mint-ui的Swipe组件是一样的。
<image-swipe></image-swipe>
有上面重写组件的思路,基本上可以开拓了一片新大陆,说的有点夸张, 哈哈哈~
写在后面
假设,组件中嵌套为暴露出来的组件,这时没有办法从组件引入,可以在原有组件的基础上重写、继承之后,开发出新的功能,不一定修复存在的bug。
import {Table
} from 'element-ui'export default {extends: Table.components.TableHeader
}
以上是重写Table中的tableHeader组件,tableHeader组件无法从element-ui中获取,通过Table.components.TableHeader去获取。
本文提供一种解决在引用第三库存在bug的解决方案,仅供参考。如果不对,请指正!