V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
mht
V2EX  ›  程序员

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

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

    最近一个项目,任务分配原因,分到几个大模块的前端交互,感觉后端写的接口老是各种问题,要么感觉需求没看清楚,要么就是有 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
    你单独写前端,他们单独写后端, 双方都好了再来联调。 感觉你们是一起开发, 那当然蛋疼
    wunonglin
        19
    wunonglin  
       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 比价助手做的不错😁👍😼
    wunonglin
        31
    wunonglin  
       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 "接口有问题"
    DOLLOR
        32
    DOLLOR  
       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 那既然这样了就只能使出绝招了。。。加多一层专门抽象专门转移后端传过来的数据,性能什么的以后再说吧,哈哈。
    wunonglin
        34
    wunonglin  
       2020-10-15 22:43:07 +08:00
    @wunonglin #31 js 是可以字符串和数字混用的,这里报错是 ts 的类型报错


    @DOLLOR #32 哈哈哈哈哈,对啊,毕竟人家看不到数据就说页面有问题,我是真的 fo
    wunonglin
        35
    wunonglin  
       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   ·   实用小工具   ·   2822 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 14:12 · PVG 22:12 · LAX 06:12 · JFK 09:12
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.