不谈技术、只谈心得。多思考、多查资料，Vue可复用组件并不难写。

从vue刚开源没多长时间，就开始关注，应用到大大小小项目中也已经接近两年，感觉这个框架真的越用越好用，轻量是一方面，重要的是很容易上手，即使遇到不懂得地方，查一下官方文档，就能马上解决。

在做实际的项目中，经常会有很多相似的地方，比如轮播图、跑马灯、弹出框等，之前为了快速开发完成项目进度，一直都在使用别人造好的轮子。其实自己也很想封装出一套自己的vue组件，不仅可以更加方便开发，也可以加深一下对vue的理解。

在开发之前思考了很多，把能想到的地方都尽量想到，并分析该怎样做出复用性很强的组件。

拿轮播图组件来简单说一下：

看过github上大神写的源码，很多应用了slot（不知道的查一下官方文档，说的很详细）来控制组件内部的元素，感觉确实很方便。

其实除了这种方法，还可以通过数据传递，并配合vue已经存在的属性，共同来完成组件。在做轮播图组件的时候便应用了这种方法，而且也很简单。

平时做的轮播图，大多都是左右移动、淡入淡出的效果。在vue文档“过渡&动画”这一块儿，对过渡、动画做出了详细的介绍，只要应用enter、enter-active、leave、leave-active这几个属性，并配合css就可以轻松实现，这样做轮播图组件便简单许多。而内部元素通过data数据进行传递，不仅易于复用，还可以轻松做到与后台的交互。

建议在开发时更多用slot方法，而对于用数据传递的方式能够更便于使用者使用的组件，选择这种方法会更好。

API设置

对于设置组件参数这块，想的比较全面，把能控制的地方全部设置了参数，包括对样式的控制。网上大多组件都是传递参数改变状态，并没让使用者对样式做出调整，这样在使用时，可能还需要进行源代码修改，感觉不是很方便。

把一个组件做好后，一定要做的是写demo，尽量把内容写的全面，包括使用方式、API、不同的效果，让使用者能轻易看懂，因为使用者使用这个组件当然是为了要方便开发，如果看文档demo都很费劲，那为何不自己去写一个呢。

记得开源

代码写好后，尽量还是开源放到github上，这样就会有很多大神来帮助完善，前期可能不会，但是不要气馁，坚持下去，总会有人发现你的。

总结

组件的开发并未有想象中那么难，只要理清思路，把想要呈现的效果一步一步写好，把该做活的地方做出来就可以了。当然也会遇到坑，不要着急，多查资料，查文档，google，百度，都会解决，因为很多坑都有大神为你填好了。

这篇没有谈技术，只是说出一些自己的心得，其中也有很多不足之处，还需要继续学习，后续会给出所做的组件github地址。