zhennann 最近的时间轴更新
成长的过程,是脱敏的过程,也是和解的过程
2018-10-15 14:29:36 +08:00
zhennann

zhennann

CabloyJS开源全栈框架作者
V2EX 第 356142 号会员,加入于 2018-10-15 11:24:26 +08:00
Angular 等了三年,那个她已经来了
前端开发  •  zhennann  •  55 天前  •  最后回复来自 zhennann
12
Vue3 开发新范式,不用`ref/reactive`,不用`ref.value`
Node.js  •  zhennann  •  54 天前  •  最后回复来自 zhennann
57
使用 ts 的最佳境界:化类型于无形
Node.js  •  zhennann  •  102 天前  •  最后回复来自 encro
13
比 nestjs 更优雅的 ts 控制反转策略-依赖查找
Node.js  •  zhennann  •  106 天前  •  最后回复来自 newghost
7
VSCode 如何通过 Ctrl+P 快速打开 node_modules 中的文件
  •  1   
    Node.js  •  zhennann  •  2023-07-07 21:30:14 PM  •  最后回复来自 zhennann
    3
    我是这样异步加载并执行 go wasm 模块的,帮看好使不?
    Node.js  •  zhennann  •  2023-03-08 22:27:39 PM  •  最后回复来自 Kuari
    2
    开发累了就摸个鱼🐟,帮我修改一下中式英语
    编程框架  •  zhennann  •  2022-11-28 15:12:44 PM  •  最后回复来自 zhennann
    2
    一文讲透 CabloyJS 全栈框架的来龙去脉
    Node.js  •  zhennann  •  2022-12-06 21:14:50 PM  •  最后回复来自 himeson
    11
    在一个项目中同时实现“后台管理系统”和“前台应用”
    Node.js  •  zhennann  •  2022-11-09 08:43:51 AM  •  最后回复来自 zhennann
    28
    zhennann 最近回复了
    @zhongs Cabloy-Front 提供了许多 cli 命令行工具,帮助我们搭建代码骨架,所以有些代码不需要我们写,只需要写业务代码即可。可以看一下 codesandbox 在线代码演示: https://codesandbox.io/p/github/zhennann/cabloy-front-demo-codesandbox2/main?checkout=true&embed=1&file=%2Fsrc%2Fsuite%2Fa-demo%2Fmodules%2Fa-demo%2Fsrc%2Fpage%2Fcounter%2Fcontroller.ts
    @tikazyq 已经将 mother 相关的术语改为 controller 。多谢建议🙏
    55 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @tianzi123 如果代码都在 sfc 中,使用这些语法糖确实舒服。但是代码一多就乱;如果想拆分多个 hook 出去,这些语法糖的使用可能就不太方便了。Cabloy-Front 采用 ioc 容器,从一开始就把结构搭好了,不论代码再多也不会乱,而且可以平滑的扩张。
    55 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @tianzi123 我也不喜欢 vue2.6 的装饰器写法。但是 Cabloy-Front 采取的策略完全不同。之前的装饰器写法不好用,是因为在用 class 定义 Vue 组件。实践证明,用函数式定义 Vue 组件最方便。所以,Cabloy-Front 仍然在视图层使用 setup 语法糖来定义组件(包括 Props 和 Emits ),而在业务层引入 ioc 容器和 class 。同时又采用了依赖注入与依赖查找相结合的策略,大量减少装饰器函数的使用,让代码更简洁优雅。这是 codesandbox 的在线演示,可以看一下: https://codesandbox.io/p/github/zhennann/cabloy-front-demo-codesandbox2/main?checkout=true&embed=1&file=%2Fsrc%2Fsuite%2Fa-demo%2Fmodules%2Fa-demo%2Fsrc%2Fpage%2Fcounter%2Fcontroller.ts
    56 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @wuzzispacelake 你说的情况我了解。Vue team 不认可 class api 的理由我也看到了。他们的理由是使用 class 定义 vue 组件并不方便,代码冗余,性价比不高。这点我也认同。社区有好几款基于 class 来定义 vue 组件的方案,效果都不是很理想。这就说明了一个道理:Class 不应该用在视图层,而是要用到业务层。所以,Cabloy-Front 仍然在视图层使用 setup 语法糖来定义组件(包括 Props 和 Emits ),而在业务层引入 ioc 容器和 class 。这样,可以充分利用二者的优势,让整个代码更加简洁优雅。因为使用了 class 之后,再也不需要使用 ref/reactive 了,也不需要 ref.value 了。可以参考这篇文章:为什么需要 Vue3+IOC: https://front.cabloy.com/zh/guide/start/why.html
    56 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @sunorg 这种情况我也遇到过。随机性比较强,比较魔幻。
    56 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @IvanLi127 你可以对比一下 Angular 和 Cabloy-Front 的代码风格,看看是不是这么回事。这里有一些视频,可以作为参考: https://front.cabloy.com/zh/guide/resources/videos.html
    56 天前
    回复了 zhennann 创建的主题 前端开发 Angular 等了三年,那个她已经来了
    @wuzzispacelake Cabloy-Front 采用的 class 机制与 Vue Class Component 有本质区别。Vue Class Component 不好用,是因为想用 class 解决 Vue 组件的定义问题。而 Cabloy-Front 仍然采用 Vue3 setup 语法糖来定义组件(如组件的 Props 和 Emits ),仅在业务层面引入 ioc 容器和 class 。这样,就结合了二者的优点,让代码更加简洁优雅。在 ioc+class+ts 的语境下,this 不仅可以清晰定位代码来源,还能更加快捷的访问系统能力。this 的弊端,仅仅是针对 mixins 和 options api 而言。
    rxjs 是 angular 中的用法,Cabloy-Front 中并没有采用。
    Cabloy-Front 提供了两类 ioc 容器:一类是全局 ioc 容器,可以实现 pinia 的能力。另一类是组件实例 ioc 容器,该容器与 Vue 组件实例绑定,在这个容器中的所有 Class 实例都可以在组件实例范围之内共享数据和逻辑。
    @Daotin 简单的方案容易上手,却不容易适应项目的膨胀。为什么许多项目,代码一多就乱,就是因为前期没有规划,怎么简单怎么来。可以看一下这篇文章:为什么需要 Vue3+IOC: https://front.cabloy.com/zh/guide/start/why.html
    @ceilingyear 一个文件确实能解决问题,但是使用三个文件是为了解耦合,以便更好的适应业务的膨胀。
    1. index.vue:在这个文件中,使用 vue3 的语法糖定义组件的 props 和 emits
    2. mother.ts:一个 vue 组件实例对应一个 ioc 容器。该容器与 Vue 组件实例绑定,在这个容器中的所有 Class 实例都可以在组件实例范围之内共享数据和逻辑。那么,mother class 就是这个 ioc 容器中的第一个 class 。组件的业务逻辑就从这里展开
    3. render.tsx:在这个 render class 中编写 tsx 代码,实现界面渲染。在一个独立的文件中书写 tsx 代码,从而让 tsx 代码更加舒展、从容。不知你是否有如此体验:如果仅仅在一个 SFC 文件写 tsx 代码,总是很局促的。当业务比较复杂的时候,展开很麻烦,代码逻辑不容易区分开

    此外,Cabloy-Front 所采用的 class 机制,与社区现有的多个 class 方案有本质的区别,因此,逻辑更清晰,代码更优雅。可以看一下这篇文章:为什么需要 Vue3+IOC: https://front.cabloy.com/zh/guide/start/why.html
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5492 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 02:49 · PVG 10:49 · LAX 19:49 · JFK 22:49
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.