vue el-dialog封装成子组件（组件化）

前言

• 实际开发过程中我们经常听见组件化开发，但在实际开发过程中（没有人审查时）怎么方便来

• 我们有时是因为时间不够，所以把所有代码写在一个页面。当业务逻辑复杂时可能会有1k多行

• 虽然不能要求自己写出高效复用性高的组件，把dialog弹出框写成一个子组件抽走还是可以的

• 当你把表单抽在就会发现代码少了很多

代码实现

1.在文件下创建components文件夹创建DialogForm.vue文件

​

2.在index.vue页面中使用

// 引入组件
import DialogForm from './components/DialogForm.vue'
​
//注册组件
 components: {
    DialogForm
  },
  
//data
 DialogFlag: false
​
// html

​
// 使用组件
  打开表单
            
 examinadd () {
      this.DialogFlag = true
    },

---

总结：

经过这一趟流程下来相信你也对 vue el-dialog封装成子组件（组件化）有了初步的深刻印象，但在实际开发中我 们遇到的情况肯定是不一样的，所以我们要理解它的原理，万变不离其宗。加油，打工人！

什么不足的地方请大家指出谢谢 -- 風过无痕