远程岗位，不限地点
工作内容：
1.视频翻译为主，有脚本提供，翻译的语言方向主要为中译外。
2.语种，中->英，日，德，法，韩，意，西班牙，葡萄牙，土耳其，泰语，印尼语。
3.翻译内容为电影电视剧，人物访谈片，企业宣传片，短视频，课程翻译等。
要求：
1.有剧本翻译，字幕组翻译或字幕软件操作经验的译者优先考虑。
2.英语专八/雅思7.0/catti2以上水平的译者优先考虑，或其他小语种相关语言证书，但不是硬性条件。
3.能制作双语字幕的小伙伴即可优先考虑(翻译和时间轴制作)，只会做翻译，不会做时间轴的译者也可以报名。
公司信息
SDL is the leader in language translation and global content management.
With about 30 years' experience, SDL helps companies build relevant digital experiences that deliver transformative business results on a global scale and create a global impact by creating relevant customer experiences for companies with worldwide customers.
Headquartered in the UK with over 70 offices across North America, Asia, Europe and the Middle East, SDL provides an unmatched combination of global digital content management with internationally trusted language translation software and services.
More information at www.sdl.com点击阅读原文进行申请
近期课程：性价比超高的CATTI翻译证备考网课

react-transition-group 翻译系列

当前模块原文地址：https://reactcommunity.org/react-transition-group/css-transition

react-transition-group 之 Transition

react-transition-group 之 CSSTransition

react-transition-group 之 SwitchTransition

react-transition-group 之 TransitionGroup

CSSTransition组件的灵感来源ng-animate（详情） 库,如果你正在使用CSS来实现过渡或者动画可以使用该组件。CSSTransition组件是基于 Transition组件来封装的，因此，该组件继承了Transition（详情)组件的所有属性。

A transition component inspired by the excellent ng-animate library, you should use it if you’re using CSS transitions or animations. It’s built upon the Transition component, so it inherits all of its props.

CSSTransition组件在appear（首次加载）, enter(进入阶段), 和exit（退出阶段）的时候会应用一对相应的类名。所有阶段的第一帧的类名都在这些阶段本身，然后下一帧使用的类名是阶段本身加上-active(appear-active, enter-active, exit-active)。在过渡结束后，把active换成done来持久应用

CSSTransition applies a pair of class names during the appear, enter, and exit states of the transition. The first class is applied and then a second *-active class in order to activate the CSS transition. After the transition, matching *-done class names are applied to persist the transition state.

function App() {
  const [inProp, setInProp] = useState(false);
  return (
    <div>
      <CSSTransition in={inProp} timeout={200} classNames="my-node">
        <div>
          {"I'll receive my-node-* classes"}
        </div>
      </CSSTransition>
      <button type="button" onClick={() => setInProp(true)}>
        Click to Enter
      </button>
    </div>
  );
}

当 in属性被设置成 true的时候，子组件第一时间添加一个类名 example-enter, 然后在下一帧将会把example-enter-active 添加到子组件的类名中。CSSTransition组件会强制**回流（重新布局）**在添加example-enter-active类名之前。这是一个很重要的技巧，因为它允许我们在example-enter和example-enter-active类名之间过渡，即使他们会被立马的一个接一个的添加到子组件中：最值得我们注意的是，它可以尽可能的使我们去设置动画样式。

When the in prop is set to true, the child component will first receive the class example-enter, then the example-enter-active will be added in the next tick. CSSTransition forces a reflow between before adding the example-enter-active. This is an important trick because it allows us to transition between example-enter and example-enter-active even though they were added immediately one after another. Most notably, this is what makes it possible for us to animate appearance.

.my-node-enter {
  opacity: 0;
}
.my-node-enter-active {
  opacity: 1;
  transition: opacity 200ms;
}
.my-node-exit {
  opacity: 1;
}
.my-node-exit-active {
  opacity: 0;
  transition: opacity 200ms;
}

*-active 类名是用于设置你想要的动画效果，因此对于过渡动画的类名是非常重要的，否则过渡动画可能不能展示照预期的效果！当过渡动画是相同可能不是很明显， 例如：当*-enter-active  和 *-exit 类名相同时候，就像下面的例子，但是如果在复杂动画中会变得更加明显，案例查看 example

*-active classes represent which styles you want to animate to, so it’s important to add transition declaration only to them, otherwise transitions might not behave as intended! This might not be obvious when the transitions are symmetrical, i.e. when *-enter-active is the same as *-exit, like in the example above (minus transition), but it becomes apparent in more complex transitions.

注意： 如果你正在使用 appear 属性，确保设置 .appear-*  类名

Note: If you’re using the appear prop, make sure to define styles for .appear-* classes as well.

Props
接收Transition组件所有属性，并且附加说明

Accepts all props from  unless otherwise noted .

classNames
动画类名将会被应用给组件当它appears, enters, exits 或者已经完成过渡。赋值给classNames一个字符串将会作为每一个阶段的前缀名称，例如： classNames="fade" 结果：

The animation classNames applied to the component as it appears, enters, exits or has finished the transition. A single name can be provided, which will be suffixed for each stage, e.g. classNames=“fade” applies:


fade-appear, fade-appear-active, fade-appear-done
fade-enter, fade-enter-active, fade-enter-done
fade-exit, fade-exit-active, fade-exit-done

有关如何应用这些类的一些详细信息：

它们与子组件上已经定义的样式相结合，因此如果要添加一些基本样式，可以使用类名，而不必担心它会被重写
如果组件以in={false}属性来进行过渡挂载，没有任何类名被应用组件。你可能期待需要*-exit-done类名，但是如果你仔细想一想，组件没有完成exiting(退出中)是不能进入entered(完成进入)状态
fade-appear-done 和 fade-enter-done类名都会被应用到组件。它允许你自定义不同的行为在组件初appearing始化完成或者常规entering进入已经完成，使用类似的选择器.fade-enter-done:not(.fade-appear-done)。例如：当DOM元素初始化时，你可以使用Animate.css来实现一些非常绚丽的动画。否则，您可以简单地使用fade-enter-done来定义这两种情况


A few details to note about how these classes are applied:

They are joined with the ones that are already defined on the child component, so if you want to add some base styles, you can use className without worrying that it will be overridden.
If the transition component mounts with in={false}, no classes are applied yet. You might be expecting *-exit-done, but if you think about it, a component cannot finish exiting if it hasn’t entered yet.
fade-appear-done and fade-enter-done will both be applied. This allows you to define different behavior for when appearing is done and when regular entering is done, using selectors like .fade-enter-done:not(.fade-appear-done). For example, you could apply an epic entrance animation when element first appears in the DOM using Animate.css. Otherwise you can simply use fade-enter-done for defining both cases.


每个单独的类名也可以单独指定，如:

Each individual classNames can also be specified independently like:

classNames={{
 appear: 'my-appear',
 appearActive: 'my-active-appear',
 appearDone: 'my-done-appear',
 enter: 'my-enter',
 enterActive: 'my-active-enter',
 enterDone: 'my-done-enter',
 exit: 'my-exit',
 exitActive: 'my-active-exit',
 exitDone: 'my-done-exit',
}}

或者如果你想使用CSS 模块化来设置类名

If you want to set these classes using CSS Modules:

import styles from './styles.css';

你可能想要在你的CSS文件使用大驼峰命名法，这样就可以简单的分散它们而不是直接的一个一个列出来

you might want to use camelCase in your CSS file, that way could simply spread them instead of listing them one by one:

classNames={{ ...styles }}

type: string | { appear?: string, appearActive?: string, appearDone?: string, enter?: string, enterActive?: string, enterDone?: string, exit?: string, exitActive?: string, exitDone?: string, }

default: ''
onEnter
在应用“enter”或“appear”类后立即触发<Transition>回调

A  callback fired immediately after the ‘enter’ or ‘appear’ class is applied.

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool)
onEntering
在“enter-active'”或“appear-active”类名后立即触发<Transition>回调

A  callback fired immediately after the ‘enter-active’ or ‘appear-active’ class is applied.

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool)

onEntered
在“enter'”或“appear”类名后立即触发<Transition>回调,并且移除这一组类名，然后 *-done类名添加到 DOM中

A  callback fired immediately after the ‘enter’ or ‘appear’ classes are removed and the done class is added to the DOM node.

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool)

onExit
A  callback fired immediately after the ‘exit’ class is applied.
**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement)

onExiting
在触发exit-active类名之后立马执行<Transition>回调

A  callback fired immediately after the ‘exit-active’ is applied.

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement)

onExited
在触发exit之后立马触发<Transition>组件的回调并且移除exit类名，然后在DOM节点中添加exit-done类名

A  callback fired immediately after the ‘exit’ classes are removed and the exit-done class is added to the DOM node.

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement)

　　                              2021考研英语翻译冲刺模拟练习(1)
　　翻译是考研英语题型，也同时是很多同学的短板。最常见的问题就是英文句子看不懂，汉语表达写不出。而英语一的翻译又都是长难句，成文很多同学头疼的题目。要处理长难句，就要求大家能分析清楚句子结构，以及句子成分之间的关系。针对长难句，我们可以先断句，让句子变成几个简短、更容易理解的句子结构，分别翻译出每个部分的含义，最后整合到一起，就完成了句子的翻译，只要按部就班，其实也没有那么难。接下来，仔细带大家一起分析、翻译一下。
　　We don’t have to learn how to be mentally healthy; it is built into us in 
the same way that our bodies know how to heal a cut or mend a broken bone.
　　根据断句长短适中、语法长度完整的原则，我们可以把这句断成3个部分如下：
　　① We don’t have to learn how to be mentally healthy;
　　② it is built into us in the same way
　　③ that our bodies know how to heal a cut or mend a broken bone.
　　分析各部分的结构：
　　① 主语(We)+谓语( don’t have to learn )+宾语从句(how to be mentally healthy)
　　② 主语( it )+谓语(is built into us)+状语(in the same way)
　　③ 定语从句：主语(our bodies)+谓语(know )+宾语(how to heal a cut or mend a broken 
bone)
　　参考译文：我们不必学习如何保持心理健康;它是我们与生俱来的，就像我们的身体知道如何治愈伤口或修复断骨。
　　以上是新东方在线考研小编为大家整理的"2021考研英语翻译冲刺模拟练习(1)"，希望能够帮助到大家，新东方在线考研小编祝大家每天坚持复习，来年迎来一个理想的成绩，相关问题尽在新东方在线考研英语翻译频道~
21考研英语全面提升班(0元领课)

目前本人学习到 react 动画组件库，react-transition-group 有一颗感兴趣的心，也想学学大神，翻译一下文档，所以就拿这个开刀，动手。 原文通道

react-transition-group 之 Transition

react-transition-group 之 CSSTransition

react-transition-group 之 SwitchTransition

react-transition-group 之 TransitionGroup

Transition 过渡
Transition  组件允许你使用一个简单的申明API去描述一个组件在一段时间内从一个状态过渡到另一个组件。最常见的是，它用于设置组件的挂载和卸载的过渡，但也可以用于描述组件状态本身的过渡

The Transition component lets you describe a transition from one component state to another over time with a simple declarative API. Most commonly it’s used to animate the mounting and unmounting of a component, but can also be used to describe in-place transition states as well.

注意: Transition  是一个不限制平台的跟组件。如果你正在使用css来过渡，你可以使用CSSTransition组件来代替。它不仅包含了Transition组件的所有功能，而且还额外包含了一些Css 过渡所必须的特征。（组件由此得名——Transition）

Note: Transition is a platform-agnostic base component. If you’re using transitions in CSS, you’ll probably want to use CSSTransition instead. It inherits all the features of Transition, but contains additional features necessary to play nice with CSS transitions (hence the name of the component).

默认情况下Transition 组件渲染不会产生额外的副作用，它仅仅是维护组件的enter和exit状态。这些状态的意义和效果取决于你。例如：当组件enter（进入）或者exite（退出）我们可以给组件添加一个内联样式。

By default the Transition component does not alter the behavior of the component it renders, it only tracks “enter” and “exit” states for the components. It’s up to you to give meaning and effect to those states. For example we can add styles to a component when it enters or exits:

import { Transition } from 'react-transition-group';
// 定义过渡的时间
const duration = 300;
// 定义默认的样式， css transition的属性
const defaultStyle = {
  transition: `opacity ${duration}ms ease-in-out`,
  opacity: 0,
}
// 动画的样式
const transitionStyles = {
  entering: { opacity: 1 },
  entered:  { opacity: 1 },
  exiting:  { opacity: 0 },
  exited:  { opacity: 0 },
};

const Fade = ({ in: inProp }) => (
  <Transition in={inProp} timeout={duration}>
    {state => (
      <div style={{
        ...defaultStyle,
        ...transitionStyles[state]
      }}>
        I'm a fade Transition!
      </div>
    )}
  </Transition>
);

Transition 组件包含 4种状态：

‘entering’ 进入中
‘entered’ 进入完成
‘exiting’ 退出中
‘exited’ 完成退出


There are 4 main states a Transition can be in:

‘entering’
‘entered’
‘exiting’
‘exited’


Transition 组件的状态通过in属性来触发。当为 true 的时候，组件开始进入 Enter(进入)阶段。在这一期间，组件将会切换它当前的阶段，从 entering(进入中) 状态等待 duration（过渡时间）完成切换到 entered(完成进入) 状态。让我举下面的例子（我们将会使用 useState 钩子）

Transition state is toggled via the in prop. When true the component begins the “Enter” stage. During this stage, the component will shift from its current transition state, to ‘entering’ for the duration of the transition and then to the ‘entered’ stage once it’s complete. Let’s take the following example (we’ll use the useState hook):

function App() {
  const [inProp, setInProp] = useState(false);
  return (
    <div>
      <Transition in={inProp} timeout={500}>
        {state => (
          // ...
        )}
      </Transition>
      <button onClick={() => setInProp(true)}>
        Click to Enter
      </button>
    </div>
  );
}

当按钮被点击时，组件将会切换到entering(进入中)状态然后保持500ms（timeout 属性定义的之）的过渡动画,它最终回切换到entered(进入完成)状态

When the button is clicked the component will shift to the ‘entering’ state and stay there for 500ms (the value of timeout) before it finally switches to ‘entered’.

当 in属性为 false时候，发和上面进入发生同样的事情，（组件切换到exiting退出中状态然后等待500ms切换到exited 退出完成状态）

When in is false the same thing happens except the state moves from ‘exiting’ to ‘exited’.

Props 属性
nodeRef
需要添加过渡的React DOM的引用：详情查看 https://stackoverflow.com/a/51127130/4671932

当 nodeRef 属性被使用时候, 节点不会传递一个回调函数（例如：onEnter 事件），因为用户已经可以直接访问该节点
在 TransitionGroup组件中改变Transition 组件中 key 的属性需要提供改变的属性key （查看 text/CSSTransition-test.js）

type: shape

A React reference to DOM element that need to transition: https://stackoverflow.com/a/51127130/4671932

When nodeRef prop is used, node is not passed to callback functions (e.g. onEnter) because user already has direct access to the node.
When changing key prop of Transition in a TransitionGroup a new nodeRef need to be provided to Transition with changed key prop (see test/CSSTransition-test.js).

type: shape


children
child属性必须是一个函数而不是React 元素。函数的参数是当前过渡状态（entering(进入中)，entered(完成进入)，exiting(退出中)，exited(完成退出)）,该状态当作上下文被用于子级组件的属性。

A function child can be used instead of a React element. This function is called with the current transition status (‘entering’, ‘entered’, ‘exiting’, ‘exited’), which can be used to apply context specific props to a component.

<Transition in={this.state.in} timeout={150}>
  {state => (
    <MyComponent className={`fade fade-${state}`} />
  )}
</Transition>

type: Function | element

required（必须）
in
用于显示里面的子组件，修改后触发进入或者退出状态

Show the component; triggers the enter or exit states

type: boolean

default: false
mountOnEnter
默认情况下，子组件和Transition 组件是立即被挂载的。如果你想在Transition组件第一次 in= {true}的情况下启用“懒加载”，你可以设置 mountOnEnter={true}。组件在第一次进入的 Transition 组件将保持在挂载，甚至在exited(完成退出)组件也保持在挂载阶段，不会生成实际的DOM,除非你特别指定unmountOnExit

By default the child component is mounted immediately along with the parent Transition component. If you want to “lazy mount” the component on the first in={true} you can set mountOnEnter. After the first enter transition the component will stay mounted, even on “exited”, unless you also specify unmountOnExit.

type: boolean

default: false
unmountOnExit
默认情况下，子组件在达到“exited(完成退出)”状态后保持挂载状态。如果希望在组件完成exiting(退出)后卸载组件，请设置unmountOnExit

By default the child component stays mounted after it reaches the ‘exited’ state. Set unmountOnExit if you’d prefer to unmount the component after it finishes exiting.

type: boolean

default: false
appear
默认情况下，子组件在第一次装载时不执行enter(进入)过渡动画，而与in的值无关。如果需要此行为，请将“appear”和“in”都设置为true

By default the child component does not perform the enter transition when it first mounts, regardless of the value of in. If you want this behavior, set both appear and in to true.

注意：这里没有额外的appear状态，类似 appearing/appeared,这个属性仅仅添加到额外的enter(进入)阶段的过渡。然而，在 <CSSTransition>组件中第一次进入过渡可以添加额外的.appea-*类名，这样就可以个性化不同的样式

Note: there are no special appear states like appearing/appeared, this prop only adds an additional enter transition. However, in the  component that first enter transition does result in additional .appear-* classes, that way you can choose to style it differently.

type: boolean

default: false
enter
启用或者禁用 enter(进入)阶段的过渡效果

Enable or disable enter transitions.

type: boolean

default: true
exit
启用或者禁用exit(退出)阶段的过渡

Enable or disable exit transitions.

type: boolean

default: true
timeout
过渡的持续时间（毫秒），必选除非提供了 addEndListener事件

The duration of the transition, in milliseconds. Required unless addEndListener is provided.

你可以指定单个时间对于整个过渡：

You may specify a single timeout for all transitions:

timeout={500}
or individually:

timeout={{
 appear: 500,
 enter: 300,
 exit: 500,
}}


appear defaults to the value of enter
enter defaults to 0 exit
defaults to 0

type: number | { enter?: number, exit?: number, appear?: number }
addEndListener
添加一个自定义过渡结束后的事件。返回的参数是过渡中的DOM节点和一个 done()回调函数。允许更细粒度处理过渡结束后的逻辑。如果使用了，超时会依然作为fallback使用

Add a custom transition end trigger. Called with the transitioning DOM node and a done callback. Allows for more fine grained transition end logic. Timeouts are still used as a fallback if provided.

注意：，当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

addEndListener={(node, done) => {
  // use the css transitionend event to mark the finish of a transition
  node.addEventListener('transitionend', done, false);
}}

type: Function
onEnter
在应用“enter”状态之前触发回调。提供了一个额外的参数isAppearing来指示enter阶段是否发生在首次挂载上

Callback fired before the “entering” status is applied. An extra parameter isAppearing is supplied to indicate if the enter stage is occurring on the initial mount

**注意：**当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool) -> void

default: function noop() {}
onEntering
在应用“enter(进入完成)”状态之前触发回调。提供了一个额外的参数isAppearing来指示enter阶段是否发生在首次挂载上

Callback fired after the “entering” status is applied. An extra parameter isAppearing is supplied to indicate if the enter stage is occurring on the initial mount

注意： 当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool)

default: function noop() {}
onEntered
在应用“enter(进入完成)”状态之前触发回调。提供了一个额外的参数isAppearing来指示enter阶段是否发生在首次挂载上

Callback fired after the “entered” status is applied. An extra parameter isAppearing is supplied to indicate if the enter stage is occurring on the initial mount

注意： 当 nodeRef属性使用时，node 不会被当作参数返回

Note:  when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement, isAppearing: bool) -> void

default: function noop() {}
onExit
在状态切换到exit(退出阶段)之前触发

Callback fired before the “exiting” status is applied.

注意： 当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement) -> void

default: function noop() {}
onExiting
在状态切换到exiting（退出中）之后触发

Callback fired after the “exiting” status is applied.

注意： 当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed.

type: Function(node: HtmlElement) -> void

default: function noop() {}
onExited
在状态切换到exit(退出完成)时触发

Callback fired after the “exited” status is applied.

注意： 当 nodeRef属性使用时，node 不会被当作参数返回

Note: when nodeRef prop is passed, node is not passed

type: Function(node: HtmlElement) -> void

default: function noop() {}