react.js javascript   这篇文章翻译自Medium的一篇文章:Container Components 选择这篇文章翻译的原因是,在刚接触React的时候,这篇文章很好的指引我了解Container Components模式. Container Component模式 Container components模式是一款很棒的React模式,对我的代码影响很大. Jason Bonta在React.js大会中说过他们如何在Facebook开发高效的组建.在这个演讲中,他提到了…

原文:Container Components Container Components 在 React 模式上对我的代码有最深远影响的一个模式叫 container component 模式. 在 React.js Conf 上,Jason Bonta 和我们讲了他们在Facebook上是如何建立高性能组件(High Performance Components).Nestled 在这个演讲中讲的就是this gem about container components. 这个概念很简单: 一…

Learn how to avoid the boilerplate of passing the props down the intermediate components by introducing more container components. Code to be refactored: const FilterLink = ({ filter, currentFilter, children, onClick }) => { if (filter === currentFil…

https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 There’s a simple pattern I find immensely useful when writing React applications. If you’ve been doing React for a while, you have probably already discovered it. This article exp…

Clean TodoApp Component, it doesn't need to receive any props from the top level component: const TodoApp = () => ( <div> <AddTodo /> <VisibleTodoList /> <Footer /> </div> ); Also we don't need wrap ReactDOM.render() into…

Code to be refacted: const TodoList = ({ todos, onTodoClick }) => ( <ul> {todos.map(todo => <Todo key={todo.id} {...todo} onClick={() => onTodoClick(todo.id)} /> )} </ul> ); let nextTodoId = 0; const TodoApp = ({ todos, visibili…

Code to be refactored: const AddTodo = ({ onAddClick }) => { let input; return ( <div> <input ref={node => { input = node; }} /> <button onClick={() => { onAddClick(input.value); input.value = ''; }}> Add Todo </button> &l…

react.js javascript 3 之前翻译了两篇关于Container&Presentational Component模型的文章,一篇是基础的Container和Component的定义,另外一篇是进阶版,因为翻译的太烂,感觉有很多错误,所以只放原文链接. 在这里我想讨论一下我自己对这个模型的一些想法. 注:便于书写,下面统一把Container&Presentational Components模型翻译为容器&展示组件模型 注:下面图片中的components文件夹指…

The components inside of your container components can easily accept Observables. You simply define your custom @Input then use the Async pipe when you pass the Observable in. This lesson walks you through the process of passing an Observable into a…

原文地址:http://www.codeproject.com/Articles/4773/Events-and-Delegates-Simplified 引用翻译地址:http://www.cnblogs.com/finesite/articles/255884.html 目录 导论 什么是委托 事件的理解 事件关键字 最后 1. 导论 在学习C#中的委托和事件过程中,我读了许多文章来理解他们二者究竟是怎么一回事,以及如何使用他们,现在我将整个的理解过程陈述以下,我学到的每一方面,恐怕也是你们…