最近写前端交互老是心态爆炸

[mht]

常年写后端代码，以前的工作流程都是前端切完页面，然后自己拿自己的接口去套页面写交互。

最近一个项目，任务分配原因，分到几个大模块的前端交互，感觉后端写的接口老是各种问题，要么感觉需求没看清楚，要么就是有 bug，然后就得停下来等他们改 bug，改完才能接着写，在这个过程里，心态就很容易爆炸，感觉如果自己写后端，肯定一开始就想好怎么写了，改的时候也是自己去改后端代码，不至于干等着，工期又卡的死死的。

就在这个循环里，经常生气，后端改完继续写，平和一会儿，然后继续生气，没有自己写后端那种行云流水的感觉。

正在等修 bug，需要发泄一下心情，来发个帖子解解压。

[zoharSoul]

前端切页面是啥意思呀

[unco020511]

jsp?

[mht]

php+vue，切页面就是前端拿到设计图切图，把样式整出来。

[vv13]

Mock Server 了解一下

[wangritian]

mock/自己写一套假接口，写页面时不用鸟他们

[Ttttnik]

对，用 mock 模拟数据，这样不耽误你的时间

[CabbSir]

假接口呢

[dk7952638]

你们考虑下前端后端一起把 graphql 搞起来

[lin07hui]

// get
pageData = { ...apiData, a: apiData.b, ... };
// post
postData = { a: formData.b, c: formData.c, ...};
完全自己定义字段，这样做就不用在改页面上的字段

[Inside]

这么说吧，我写的界面，如果演示时我不告诉你，你都不知道其实我访问的是客户端本地的 mock 数据，等于是我对业务自己做了一层数据抽象，服务端 API 对我来说只是这层抽象的不同实现中的一种。
我自己开发的时候用的是我自己的实现，根本不需要服务端。

[Tokiomi]

千万别全干，不然会像我一样被拼命压榨工期

[SelectLanguage]

@Inside 假设你自己的实现数据在一个接口里，真实服务端的数据分为两个接口，这种情况咋办呢

[hitaoguo]

约定好接口的数据格式即可脱离后端的进度束缚。

[jones2000]

如果你没事干了，可以直接站在后台开发座位后面，给他点压力。

[Inside]

@SelectLanguage 前端业务的理解与后端不一样是很常见的，这个没问题，数据层面适配一下而已，但驱动界面的仍然是前端自己的抽象。

具体拿出方法的话，用服务端 API 实现数据层时使用 Promise.all 。

[aaronlam]

是用不了 mock 吗？

[keepeye]

心态有问题，别对他人要求太高

[dajj]

你单独写前端，他们单独写后端， 双方都好了再来联调。 感觉你们是一起开发， 那当然蛋疼

[wunonglin]

说 mock 可以解决了怕是没见过“敏捷开发”的后端吧？
number，string 不定，字段时有时无，接口报错不返回固定格式直接 http500 等等。
mock 好了有毛用，数据格式都还没确定，传入字段大小写，驼不驼峰也不知道，写毛啊

[cnoder]

肯定是先定接口在 mock 啊

[tutou]

@Inside 羡慕大佬有那么多时间

[vision1900]

@wunonglin 同感，接口结构不定，Mock 就是个玩笑

[xiaoming1992]

@wunonglin 哈哈哈，我专门抽象了一层中间层，用来处理后端字段 /数据类型之类的问题，不管你后端用的什么字段、什么数据类型，统一处理成我希望的格式，再在代码中使用，这样在接口变动时能最小限度修改源码，只要改一改中间层就好了（当然接口改动过大就没办法了）

[ibx]

可以叫后端先给个大概格式。或者自己自定义自己需要的格式，让后端尽量这样返回。

[ruoxie]

接口结构不定的说明团队管理上有问题，我这边后端都会先在 yapi 上写好接口定义，然后拉个会议做接口评审，之后就是定个联调时间。联调之前我都不用管后端在干什么，直接根据 yapi 上的接口定义开撸。自己还写了个工具，直接根据 yapi 生成增删改的代码，以及 mock 。联调的时候也很顺畅，以 yapi 为准，调不通后端就改。

[ruoxie]

之前很反感老是开会，需求评审，数据库表评审（我一个前端，有时候也拉我去），接口评审，测试用例评审。合作几次后感觉是真的爽。

[geekboy]

@ruoxie 这才是正常流程，好多小公司是不会按照这个来的

[aaronlam]

@wunonglin 这个感觉再敏捷，也要先跟后端同学扯好接口才可以不背锅呀。。。

[asionbo]

@ruoxie 我们也用 yapi，不过后端是吓 jb 写的

[asionbo]

楼主 xbox 比价助手做的不错😁👍😼

[wunonglin]

@aaronlam #28

毕竟不是所有公司都是按标准开发流程来的，做的快比做的好重要多了。要真是都按标准开发，哪还有那么多屎山


比如一个客户列表，老板说要列出客户来，我问后端拿数据，但是老板没说列表要展示什么内容之说列出来，那按正常人的李姐，应该就会有 id/name/createTime/telephone 等对吧？

但是拿到接口后 telephone 变成了 mobile，createTime 变成了 create_at，我问怎么和我想的不一样，人家说数据库直接拉出来的字段名，简单快捷完成任务，那我能说什么，毕竟又不影响使用。。

但是好笑的在我正要拿 create_at 时间戳*1000 转时间居然报错了，你猜怎么着，这个 create_at 是个字符串。。。

所以我现在都在 service 层过一次，把字段名、类型转成我需要的类型后才拿去 component 用的


而且我鸡贼地在 service 层过的时候 try catch 了一下 throw "接口有问题"

[DOLLOR]

@wunonglin

我在测试环境这样抛
throw new Error('xxxx 错误，请测试同学直接找后端解决')
让测试的直接跟后端扯皮去吧。

[aaronlam]

@wunonglin 那既然这样了就只能使出绝招了。。。加多一层专门抽象专门转移后端传过来的数据，性能什么的以后再说吧，哈哈。

[wunonglin]

@wunonglin #31 js 是可以字符串和数字混用的，这里报错是 ts 的类型报错


@DOLLOR #32 哈哈哈哈哈，对啊，毕竟人家看不到数据就说页面有问题，我是真的 fo

[wunonglin]

@aaronlam #33 对啊，所以我在 service 层过一次，这样业务逻辑不会出问题，改 service 就好了

[aaronlam]

@wunonglin 哈哈，我曾经也这么干过，碰到这种情况屡试不爽。