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;
 },
作者:张泽原文地址:https://segmentfault.com/a/1190000043565858

%s 个评论

要回复文章请先登录注册