前端之家收集整理的这篇文章主要介绍了
Vue组件开发技巧总结，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
前言
临近毕业，写了个简单个人博客，项目地址是点我访问项目地址（顺便求star），本篇是系列总结第一篇。接下来会一步一步模仿一个低配版的Element 的对话框和弹框组件。
正文
Vue 单文件组件开发
当使用vue-cli初始化一个项目的时候，会发现src/components文件夹下有一个HelloWorld.vue文件，这便是单文件组件的基本开发模式。
注册
Vue.component('my-component',{
template: '
A custom component!@H_
301_13@'
})
// 创建根实例
new Vue({
el: '#example'
})
@H_301_13@
接下来，开始写一个dialog组件。
Dialog
目标对话框组件的基本样式如图：
根据目标样式，可以总结出：
- dialog组件需要一个titleprops来标示弹窗标题
- dialog组件需要在按下确定按钮时发射出确定事件（即告诉父组件确定了）
- 同理，dialog组件需要发射出取消事件
- dialog组件需要提供一个插槽，便于自定义内容
那么，编码如下:
