V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
kimoCHG
V2EX  ›  React

问问大家如何用 typescript 写 react 代码

  •  
  •   kimoCHG · 2017-12-13 22:00:42 +08:00 · 3091 次点击
    这是一个创建于 2521 天前的主题,其中的信息可能已经有所发展或是发生改变。

    TL; DR

    • 探讨下 typescript 的亮点用法
    • 求推荐在 typescript 实践上比较完善的开源项目

    背景

    最近写了一段时间的 react + typescript,但是总觉得没有发挥出 typescript 的功力,在我的实践里面只是用了 typescript 的静态类型检查替换 react 的 propTypes。

    举个例子

    这边举个例子。

    由于用的 redux 来状态管理, 优点是层次是很清楚的,不过想要完善管理状态一个 actionCreator 就得在几个文件里面各种传递,这时候不只是 props 会有类型定义,我能想到的有下面几个地方就会需要定义强类型

    • actionCreator 定义时,这里很可能是 thunk 函数,所以会把参数传给 api 层
    • api 层,这里很可能写个 urlHelper 函数,也要定义一下
    • api success、fail 要处理 response 的时候
    • mapToDispatch 内部
    • 当前、子 component 的 props
    • component 内部的方法

    想法

    我现在的使用方式,是替换 react 自带的 propTypes, 想来是 react 16 把这部分分离出来的原因,可以很大程序上减少体积,还有就是 action 可以定义成 一个 baseType 然后,各个 action extends 出更具体的,相应的 response 可以定义个 baseType,在各个 response 再定义 baseType

    最后,不知道大家有没有什么更好的想法,或者推荐一些实践比较好的开源项目启发一下。

    3 条回复    2017-12-14 09:45:14 +08:00
    Kilerd
        1
    Kilerd  
       2017-12-14 00:02:22 +08:00
    反正我用 ts 写 react 就是各种就行,先不说 proptypes 这个蛋疼的问题,reducer 在处理 action 的时候也是各种纠结。

    后来就干脆直接 js 走起了。
    crysislinux
        2
    crysislinux  
       2017-12-14 00:55:26 +08:00 via Android
    实践完善的开源项目,当然首推 angular 了咯
    kimoCHG
        3
    kimoCHG  
    OP
       2017-12-14 09:45:14 +08:00
    @Kilerd #1 现在写的时候就觉得各种将就,就是有种感觉,我用了这个跟没用没区别,蓝瘦。

    @crysislinux #2 hmmm,主要是想看下 react 这方面的实践,angular 项目有什么推荐嘛?最近刚发布 5,节奏略快。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3618 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 04:16 · PVG 12:16 · LAX 20:16 · JFK 23:16
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.