使用 Recompose 来构建高阶组件 #5025

SHERlocked93 · 2019-01-20T13:48:07Z

译文翻译完成，resolve #5019

Eternaldeath · 2019-01-21T05:44:58Z

校对认领

fanyijihua · 2019-01-21T05:45:02Z

@Eternaldeath 好的呢 🍺

seanzhou1996 · 2019-01-21T07:19:23Z

校对认领

fanyijihua · 2019-01-21T07:19:25Z

@SeanZhouSiyuan 妥妥哒 🍻

seanzhou1996 · 2019-01-21T07:36:49Z

TODO1/building-hocs-with-recompose.md

-*   Easily Mocked — Easily mock props for different situations
+*   模块化代码 - 可以在整个项目范围内复用你的代码段；
+*   只依赖于 props - 默认没有 state；
+*   更便于单元测试 - 对 enzyme/jest 更友好的测试接口；


含义不清晰：只看译文的话，对 enzyme/jest 陌生的读者，可能无法理解这句话的意思。

改为：对测试工具 enzyme/jest 更友好的测试接口

seanzhou1996 · 2019-01-21T13:58:33Z

TODO1/building-hocs-with-recompose.md


-#### Step 3 — Get your state right
+#### 步骤3 - 正确


只看标题的话，含义不明确。可改为“确保 state 无误”或类似译法。

seanzhou1996 · 2019-01-21T14:02:12Z

TODO1/building-hocs-with-recompose.md

@@ -162,15 +162,15 @@ export default compose(
 )(Presentation);
 ```

-Here we setup the state key `isVisible` , we setup a method to `toggleVis` and an initial state of false.
+这里我们设置了状态属性 `isVisible`，一个控制可见性的方法 `toggleVis`，和一个初始值 false。


此段原文中的两处 state，是否与先前的 state 含义相同？如果是的话，需要统一译法。

seanzhou1996

校对完毕，译者修改完成，顺便 @leviding 之前忘记了 LOL

Eternaldeath

翻译的很好，提出了一些小小的改动。

Eternaldeath · 2019-01-23T02:37:53Z

TODO1/building-hocs-with-recompose.md

-*   Can add “state” to any component which means you don’t have to rely Redux for everything (if you are doing so now)
-*   Manipulate the props you send down to the Presentational Component (map, reduce, w/e you want!)
+*   可以给其他的展示型组件进行相同的代码复用；
+*   简化可读性较差的臃肿的组件；


『简化可读性较差的臃肿的组件』=>『清理可读性较差的臃肿的组件』

这里清理可能容易歧义

Eternaldeath · 2019-01-23T02:50:09Z

TODO1/building-hocs-with-recompose.md


-And there we were, digging the pattern, and off to the races. We hit a couple problems along the way. It became super tedious to constantly write the same HOC syntax for simple things, we didn’t have patterns for combining multiple enhancers together, and we couldn’t prevent the development of duplicate enhancers (this annoys me the most, but I know happens). It was getting hard to prove the value of this pattern as people were getting bogged down in the syntax and the ideas of HOCs (much like engineers do).
+然后我们开始在生产环境中深度使用高阶组件了，并在使用过程中遇到了几个问题。比如为简单的场景不断地编写简单地高阶组件就很无聊，没有将多个高阶组件进行合成的方法，也无法避免开发出冗余的高阶组件（这个最麻烦，但我清楚这有时确实会发生）。人们逐渐陷入高阶组件的语法和观念中寸步难行，这种模式似乎也已渐渐失去了价值。


1.much like engineers do 没有翻译出来
2.『这种模式似乎也已渐渐失去了价值』=>『很难证明这种模式的价值』

Eternaldeath · 2019-01-23T03:01:40Z

TODO1/building-hocs-with-recompose.md


-`withHandlers` create higher-order functions that accept a set of props and return a function handler, in this case responsible for toggling visibility state. The `toggleVisibility` function will be available to our Presentation component as a prop.
+`withHandlers` 创建了一个高阶组件，它接受一系列 `props` 并返回一个处理函数，在这个例子中是处理可见性 `state` 的函数。`toggleVisibility` 这个函数将作为 `Presentation` 组件的一个 `prop`。


『在这个例子中是处理可见性 state 的函数』=>『在这个例子中是切换可见性 state 的函数』

Eternaldeath · 2019-01-23T03:04:01Z

校对完毕

SHERlocked93 · 2019-01-23T07:06:17Z

@Eternaldeath @SeanZhouSiyuan 非常感谢校对，辛苦了~

@leviding 已根据校对意见修改

leviding · 2019-01-23T10:48:10Z

@SHERlocked93 已经 merge 啦~ 快快麻溜发布到掘金然后给我发下链接，方便及时添加积分哟。

掘金翻译计划有自己的知乎专栏，你也可以投稿哈，推荐使用一个好用的插件。
专栏地址：https://zhuanlan.zhihu.com/juejinfanyi

SHERlocked93 · 2019-01-23T11:07:50Z

@leviding 已经发布啦，地址： https://juejin.im/post/5c484a43e51d452ec621b6a9

SHERlocked93 added 4 commits January 20, 2019 21:32

building-hocs-with-recompose

6eb1a30

fix

de1d0aa

fix：ensure the same line

23e25e4

fix: add punctuation

d1fe84b

fanyijihua added the 校对认领 label Jan 20, 2019

leviding mentioned this pull request Jan 21, 2019

使用 Recompose 来构建高阶组件 #5019

Closed

leviding added the 前端 label Jan 21, 2019

fix: update some terms

1c0b634

fanyijihua added the 正在校对 label Jan 21, 2019

fanyijihua removed the 校对认领 label Jan 21, 2019

seanzhou1996 reviewed Jan 21, 2019

View reviewed changes

根据校对意见修改 @SeanZhouSiyuan

ad7ab39

seanzhou1996 previously approved these changes Jan 22, 2019

View reviewed changes

Eternaldeath reviewed Jan 23, 2019

View reviewed changes

根据 @Eternaldeath 的校对意见修改

2b748d9

SHERlocked93 dismissed seanzhou1996’s stale review via 2b748d9 January 23, 2019 07:03

增加校对者

ed8ae20

leviding added the 标注待管理员 Review label Jan 23, 2019

Update building-hocs-with-recompose.md

b61225b

leviding approved these changes Jan 23, 2019

View reviewed changes

leviding added 翻译完成 and removed 标注待管理员 Review 正在校对 labels Jan 23, 2019

leviding merged commit 0dc6ef4 into xitu:master Jan 23, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

使用 Recompose 来构建高阶组件 #5025

使用 Recompose 来构建高阶组件 #5025

SHERlocked93 commented Jan 20, 2019 •

edited

Loading

Eternaldeath commented Jan 21, 2019

fanyijihua commented Jan 21, 2019

seanzhou1996 commented Jan 21, 2019

fanyijihua commented Jan 21, 2019

seanzhou1996 Jan 21, 2019

SHERlocked93 Jan 22, 2019

seanzhou1996 Jan 21, 2019

seanzhou1996 Jan 21, 2019

SHERlocked93 Jan 22, 2019

seanzhou1996 left a comment

Eternaldeath left a comment

Eternaldeath Jan 23, 2019

SHERlocked93 Jan 23, 2019

Eternaldeath Jan 23, 2019

SHERlocked93 Jan 23, 2019

Eternaldeath Jan 23, 2019

Eternaldeath commented Jan 23, 2019

SHERlocked93 commented Jan 23, 2019

leviding commented Jan 23, 2019

SHERlocked93 commented Jan 23, 2019


		And there we were, digging the pattern, and off to the races. We hit a couple problems along the way. It became super tedious to constantly write the same HOC syntax for simple things, we didn’t have patterns for combining multiple enhancers together, and we couldn’t prevent the development of duplicate enhancers (this annoys me the most, but I know happens). It was getting hard to prove the value of this pattern as people were getting bogged down in the syntax and the ideas of HOCs (much like engineers do).
		然后我们开始在生产环境中深度使用高阶组件了，并在使用过程中遇到了几个问题。比如为简单的场景不断地编写简单地高阶组件就很无聊，没有将多个高阶组件进行合成的方法，也无法避免开发出冗余的高阶组件（这个最麻烦，但我清楚这有时确实会发生）。人们逐渐陷入高阶组件的语法和观念中寸步难行，这种模式似乎也已渐渐失去了价值。


		`withHandlers` create higher-order functions that accept a set of props and return a function handler, in this case responsible for toggling visibility state. The `toggleVisibility` function will be available to our Presentation component as a prop.
		`withHandlers` 创建了一个高阶组件，它接受一系列 `props` 并返回一个处理函数，在这个例子中是处理可见性 `state` 的函数。`toggleVisibility` 这个函数将作为 `Presentation` 组件的一个 `prop`。

使用 Recompose 来构建高阶组件 #5025

使用 Recompose 来构建高阶组件 #5025

Conversation

SHERlocked93 commented Jan 20, 2019 • edited Loading

Eternaldeath commented Jan 21, 2019

fanyijihua commented Jan 21, 2019

seanzhou1996 commented Jan 21, 2019

fanyijihua commented Jan 21, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

seanzhou1996 left a comment

Choose a reason for hiding this comment

Eternaldeath left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Eternaldeath commented Jan 23, 2019

SHERlocked93 commented Jan 23, 2019

leviding commented Jan 23, 2019

SHERlocked93 commented Jan 23, 2019

SHERlocked93 commented Jan 20, 2019 •

edited

Loading