乐趣区

关于vue.js:vue-components-分层开发-组件复用

由 Stu.vue 代码拆分为三个规范的 component,
StuList.vue, StuAdd.vue, StuEdit.vue

app

StuList, 含有 el-table

StuEdit, 含有 el-dialog

StuAdd, 含有 el-dialog

代码构造更清晰, 业务解决更加标准, 便于大我的项目保护和二次开发
组件能够简略的了解为 dom 和 js 的组合, 但设计出一个部分的片段, 既能够开发出对应的组件, 而后在后续的业务应用时 (每一次), 调用这个组件即可
例如, jeecg 框架的分页等性能就相当于一个组件

要害代码
<StuEdit ref=”stuEdit” />

getStu: function(bean){//lsit 组件 -->[stuEdit]-->stuEdit-->
          quan.$refs.stuEdit.getStu(bean);
      },
      showAdd: function(){//-->App.vue-->[stuList, stuAdd]-->.stuAdd.addFlag=true;
          quan.$parent.$refs.stuAdd.addFlag=true;
          
          //quan.$parent.$refs.stuAdd.addFlag=true;
      },
退出移动版