这是一个创建于 1197 天前的主题，其中的信息可能已经有所发展或是发生改变。
-
场景:
-
后端 api 返回的格式和字端可能不是前端展示需要的格式
-
后端接口变化(结构 /字段), 涉及的多个前端页面可能也要改,改动量较大且琐碎
-
mock 定义的和实际的有差异
-
-
需求:
-
请求->
数据转换 /处理->数据流转->数据展示交互, 在请求和 vm 层再加一层处理 -
不管后端返回什么格式 /字端, 统一处理成前端自己定义的
-
后端接口变化, 只改 model 中间层
-
-
思考:
-
node.js 中间服务搞不了, 没人懂, 也没资源
-
Vuex 似乎有点那么意思, 我之前是在 getter 作处理, 但 Vuex 是用来状态管理和共享的, 把所有数据都交给 Vuex 不合适
-
其他开发人员应该有类似的需求, 在站内也看到有人建了 serve 层处理接口的数据, 但我没搜到相关的 demo, 实践该怎么做没思路
-
-
求助内容:
- 有相关的成熟案例可以参考吗? 最好是像 element, antDesignVue 这样的
 |
1
lower 2021-09-01 16:49:40 +08:00
这种感觉是要后端处理，搞什么 VO DTO DO PO😂
|
 |
2
wunonglin 2021-09-01 16:54:05 +08:00
页面 => service <= 后端
对于数据的接收发送处理和转换，抽在 service 层处理 |
|
3
wunonglin 2021-09-01 16:58:12 +08:00  1
说大白话就是发数据的时候在 service 把数据转成后台要的，接收的时候把后台散的数据处理成你页面要的
|
 |
4
jqtmviyu OP @wunonglin #3 有相关的案例可以参考吗? 对于 serve 层和 api 和页面之间的调用, serve 层的模块化, 和数据汇集和共享, 没什么思路. 如果是自己用, 随便几个 js 引入调用就完事了, 但我是想把它像 vueX 一样集成到框架里, 自己摸索出来的东西实在没信心在团队里一起用.
|
|
5
wunonglin 2021-09-01 17:08:53 +08:00
|
|
6
wunonglin 2021-09-01 17:13:41 +08:00
@jqtmviyu #4
参考 ng 的 service 的概念咯。这个业务而已，没有框架的。 假如你数据不需要转换，那么在 service 直接把接收到的数据直接 return 就好了。 这样做也有好处就是如果后端改数据的话，我只需要改 service 而已，不需要每个调用的页面都要改。 另外你提到的 vuex 。不要把请求放 vuex 里，虽然可以，但是别。 |
 |
7
hackyuan 2021-09-01 17:17:32 +08:00
一，在 axios 的响应拦截进行规范处理
二，如分页接口，抽象为 useFetchPageData，中间逻辑自己补 三，数据被多处使用时将数据存储在 vuex，配合 getter 或 mutation 中处理 四，抽象个 util，对数据进行单独处理 |
 |
8
FreeEx 2021-09-01 17:17:34 +08:00
假设你要查询用户详情，不要直接查询接口拿到数据然后渲染页面，可以定义一个函数，返回对象是前端定义的用户详情 model，在这个函数里面调用接口来查询数据，然后转换后端返回的数据为前端定义的用户详情 model 。
这种写法是后端使用广泛，因为会复用相关的函数，前端往往是某一个页面查询显示某一些数据，在其他地方用不到，也就省略了这一步，还一个原因就是 js 发的 xhr 请求是异步的，封装使用不太方便，但是现在 js 已经有 async await 了，问题已经不复存在了。 |
 |
9
TomVista 2021-09-01 17:42:59 +08:00
突然想起来这个东西 vue filter
https://cn.vuejs.org/v2/guide/filters.html |
 |
10
libook 2021-09-01 18:26:59 +08:00
如果做 Web+App 跨平台支持的话，这个不能在前端做，因为 App 没法实时更新，所以很多企业的方案是前端+BFF+后端的方式，API 映射工作在 BFF 层做，确保后端不管怎么变，BFF 都能做相应处理来兼容前端各版本。
|
 |
11
keepeye 2021-09-01 18:44:03 +08:00
api 请求封装不就是干这个事情的吗？难道你直接在 methods 里调用 axios?
|
|
12
jqtmviyu OP @keepeye #11 api 只是调用了 axios 实例传参, 是想再加多一层, 结合业务和页面, 对后端的数据进行组装
|
 |
13
lecion 2021-09-09 00:54:43 +08:00
可以参考下 MVP 模式，或者 Clean Architecture 的设计理念。Vue 本质上只是一套 UI 框架，我认为好的业务的设计应该是脱离 UI 的。对于 Model 来说，我认为 Model 是需要分类的：对于页面的渲染，需要建模，比如弹框的显示与否的状态值；对于业务数据就更需要建模，且要保持这块模型的干净。而目前大多数开发者，是将页面模型与业务模型混在一起的，Vue 文件里 data 一把梭，普通页面，简单流程这并没有什么问题，但业务流程一旦复杂，将变得很难维护。
|
Select Language