我是歌谣 放弃很容易 但是坚持一定很酷

1前言

在我们的日常的开发过程中
不免会遇到需要操作同一页面得情况

2需求

比如一个页面 我们会有一个对应的一个表单

A:姓名:XXXX
B：年龄:XXXX
C:账号:XXXX
D：密码:XXXX
E:邮箱:XXXX
XXXXX

el-form
	el-input name
	el-input age
	el-input account
	el-input password
	el-input email

要是你需要做一个验证直接

	el-form rules

基本的样式和代码展示就如上图所示
一般的表单我们需要有一个el-table的表格行

el-table
	el-table-column name
	el-table-column age
	el-table-column account
	el-table-column password
	el-table-column email

获取当前行的属性我们可以

template
	scope-slot
		scope-row

3解决方案

首先展示编辑页面和新增页面有两种方案
弹出框和路由都是可以实现的提示

3.1.1dialog

el-dialog

3.1.2route

route

我们目前已第一种来说

el-dialog

3.1.3笨拙解决方案

route
	新建页面

route
	编辑页面

route
	查看页面

4思考

这种方案是具有可行性 但是代码未免有点过分冗余
于是转换为新方案 还是需要进行的是页面的一个判断

route
	页面新建|编辑|查看

这个时候思考的是页面跳转的判断条件
首先查看和编辑和新建的一个判断条件是否会存在id的属性

4.1.1query传参

 route
 	query{:id}

对于当前的页面有id的我们可以进行一个编辑
查看的操作 没有id就是我们的新增操作

4.1.2 第三方插件传参

可以采用store2 等进行页面传参 目的是对当前的页面带到下一个
页面可以做一个判断

4.1.3其余逻辑

对于其余逻辑的完善我们就需要分别查看和编辑的一个逻辑
两者都是可以有id的输入 我们可以在页面进入的时候带入一个参数
进入下一个页面

skip（param1,param2）

当parma2为编辑则进行编辑逻辑 查看则显示查看逻辑

其余逻辑

页面的其余部分都是通过判断获得 代码简洁生动

5总结

我是歌谣 以上代码均为简写 原创不易 欢迎一起讨论学习前端知识,前端学习ing…