最近写前端交互老是心态爆炸 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
请不要在回答技术问题时复制粘贴 AI 生成的内容
mht
V2EX    程序员

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

  •  
  •   mht
    haijiao1945 2020-10-15 11:07:32 +08:00 6121 次点击
    这是一个创建于 1892 天前的主题,其中的信息可能已经有所发展或是发生改变。
    常年写后端代码,以前的工作流程都是前端切完页面,然后自己拿自己的接口去套页面写交互。

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

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

    正在等修 bug,需要发泄一下心情,来发个帖子解解压。
    36 条回复    2020-10-16 00:18:56 +08:00
    zoharSoul
        1
    zoharSoul  
       2020-10-15 11:09:51 +08:00
    前端切页面是啥意思呀
    unco020511
        2
    unco020511  
       2020-10-15 11:10:42 +08:00
    jsp?
    mht
        3
    mht  
    OP
       2020-10-15 11:12:33 +08:00
    php+vue,切页面就是前端拿到设计图切图,把样式整出来。
    vv13
        4
    vv13  
       2020-10-15 11:13:44 +08:00
    Mock Server 了解一下
    wangritian
        5
    wangritian  
       2020-10-15 11:15:02 +08:00
    mock/自己写一套假接口,写页面时不用鸟他们
    Ttttnik
        6
    Ttttnik  
       2020-10-15 11:47:44 +08:00
    对,用 mock 模拟数据,这样不耽误你的时间
    CabbSir
        7
    CabbSir  
       2020-10-15 12:56:44 +08:00
    假接口呢
    dk7952638
        8
    dk7952638  
       2020-10-15 13:54:51 +08:00
    你们考虑下前端后端一起把 graphql 搞起来
    lin07hui
        9
    lin07hui  
       2020-10-15 13:55:06 +08:00
    // get
    pageData = { ...apiData, a: apiData.b, ... };
    // post
    postData = { a: formData.b, c: formData.c, ...};
    完全自己定义字段,这样做就不用在改页面上的字段
    Inside
        10
    Inside  
       2020-10-15 14:35:07 +08:00   1
    这么说吧,我写的界面,如果演示时我不告诉你,你都不知道其实我访问的是客户端本地的 mock 数据,等于是我对业务自己做了一层数据抽象,服务端 API 对我来说只是这层抽象的不同实现中的一种。
    我自己开发的时候用的是我自己的实现,根本不需要服务端。
    Tokiomi
        11
    Tokiomi  
       2020-10-15 16:03:42 +08:00
    千万别全干,不然会像我一样被拼命压榨工期
    SelectLanguage
        12
    SelectLanguage  
       2020-10-15 16:12:47 +08:00
    @Inside 假设你自己的实现数据在一个接口里,真实服务端的数据分为两个接口,这种情况咋办呢
    hitaoguo
        13
    hitaoguo  
       2020-10-15 16:17:49 +08:00   1
    约定好接口的数据格式即可脱离后端的进度束缚。
    jones2000
        14
    jones2000  
       2020-10-15 16:31:51 +08:00
    如果你没事干了,可以直接站在后台开发座位后面,给他点压力。
    Inside
        15
    Inside  
       2020-10-15 16:42:32 +08:00
    @SelectLanguage 前端业务的理解与后端不一样是很常见的,这个没问题,数据层面适配一下而已,但驱动界面的仍然是前端自己的抽象。

    具体拿出方法的话,用服务端 API 实现数据层时使用 Promise.all 。
    aaronlam
        16
    aaronlam  
       2020-10-15 16:51:35 +08:00
    是用不了 mock 吗?
    keepeye
        17
    keepeye  
       2020-10-15 16:57:00 +08:00
    心态有问题,别对他人要求太高
    dajj
        18
    dajj  
       2020-10-15 16:59:07 +08:00
    你单独写前端,他们单独写后端, 双方都好了再来联调。 感觉你们是一起开发, 那当然蛋疼
    shakaraka
        19
    shakaraka  
    PRO
       2020-10-15 17:14:48 +08:00   2
    说 mock 可以解决了怕是没见过“敏捷开发”的后端吧?
    number,string 不定,字段时有时无,接口报错不返回固定格式直接 http500 等等。
    mock 好了有毛用,数据格式都还没确定,传入字段大小写,驼不驼峰也不知道,写毛啊
    cnoder
        20
    cnoder  
       2020-10-15 17:38:51 +08:00
    肯定是先定接口在 mock 啊
    tutou
        21
    tutou  
       2020-10-15 17:56:27 +08:00
    @Inside 羡慕大佬有那么多时间
    vision1900
        22
    vision1900  
       2020-10-15 18:04:44 +08:00
    @wunonglin 同感,接口结构不定,Mock 就是个玩笑
    xiaoming1992
        23
    xiaoming1992  
       2020-10-15 18:24:19 +08:00 via Android
    @wunonglin 哈哈哈,我专门抽象了一层中间层,用来处理后端字段 /数据类型之类的问题,不管你后端用的什么字段、什么数据类型,统一处理成我希望的格式,再在代码中使用,这样在接口变动时能最小限度修改源码,只要改一改中间层就好了(当然接口改动过大就没办法了)
    ibx
        24
    ibx  
       2020-10-15 19:07:12 +08:00
    可以叫后端先给个大概格式。或者自己自定义自己需要的格式,让后端尽量这样返回。
    ruoxie
        25
    ruoxie  
       2020-10-15 20:23:17 +08:00   5
    接口结构不定的说明团队管理上有问题,我这边后端都会先在 yapi 上写好接口定义,然后拉个会议做接口评审,之后就是定个联调时间。联调之前我都不用管后端在干什么,直接根据 yapi 上的接口定义开撸。自己还写了个工具,直接根据 yapi 生成增删改的代码,以及 mock 。联调的时候也很顺畅,以 yapi 为准,调不通后端就改。
    ruoxie
        26
    ruoxie  
       2020-10-15 20:27:06 +08:00
    之前很反感老是开会,需求评审,数据库表评审(我一个前端,有时候也拉我去),接口评审,测试用例评审。合作几次后感觉是真的爽。
    geekboy
        27
    geekboy  
       2020-10-15 21:28:25 +08:00
    @ruoxie 这才是正常流程,好多小公司是不会按照这个来的
    aaronlam
        28
    aaronlam  
       2020-10-15 21:40:06 +08:00
    @wunonglin 这个感觉再敏捷,也要先跟后端同学扯好接口才可以不背锅呀。。。
    asionbo
        29
    asionbo  
       2020-10-15 21:59:52 +08:00
    @ruoxie 我们也用 yapi,不过后端是吓 jb 写的
    asionbo
        30
    asionbo  
       2020-10-15 22:01:31 +08:00
    楼主 xbox 比价助手做的不错
    shakaraka
        31
    shakaraka  
    PRO
       2020-10-15 22:04:01 +08:00
    @aaronlam #28

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


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

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

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

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


    而且我鸡贼地在 service 层过的时候 try catch 了一下 throw "接口有问题"
    AV1
        32
    AV1  
       2020-10-15 22:35:18 +08:00
    @wunonglin

    我在测试环境这样抛
    throw new Error('xxxx 错误,请测试同学直接找后端解决')
    让测试的直接跟后端扯皮去吧。
    aaronlam
        33
    aaronlam  
       2020-10-15 22:43:07 +08:00
    @wunonglin 那既然这样了就只能使出绝招了。。。加多一层专门抽象专门转移后端传过来的数据,性能什么的以后再说吧,哈哈。
    shakaraka
        34
    shakaraka  
    PRO
       2020-10-15 22:43:07 +08:00
    @wunonglin #31 js 是可以字符串和数字混用的,这里报错是 ts 的类型报错


    @DOLLOR #32 哈哈哈哈哈,对啊,毕竟人家看不到数据就说页面有问题,我是真的 fo
    shakaraka
        35
    shakaraka  
    PRO
       2020-10-15 22:44:44 +08:00
    @aaronlam #33 对啊,所以我在 service 层过一次,这样业务逻辑不会出问题,改 service 就好了
    aaronlam
        36
    aaronlam  
       2020-10-16 00:18:56 +08:00
    @wunonglin 哈哈,我曾经也这么干过,碰到这种情况屡试不爽。
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     2285 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 28ms UTC 01:48 PVG 09:48 LAX 17:48 JFK 20:48
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86