amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-23 20:23:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

[docs] Follow up to 6972 - update docs code (#7278)

Browse Source
This commit is contained in:
Paul O’Shannessy
2016-07-13 13:17:09 -07:00
committed by GitHub
parent 33faa2c9fe
commit 710f12e7e3
4 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/03-interactivity-and-dynamic-uis.ja-JP.md
View File

@@ -20,7 +20,7 @@ var LikeButton = React.createClass({
this.setState({liked: !this.state.liked});
},
render: function() {
var text = this.state.liked ? 'like' : 'haven\'t liked';
var text = this.state.liked ? 'liked' : 'haven\'t liked';
return (
<p onClick={this.handleClick}>
You {text} this. Click to toggle.

2
docs/03-interactivity-and-dynamic-uis.ko-KR.md
View File

@@ -19,7 +19,7 @@ var LikeButton = React.createClass({
this.setState({liked: !this.state.liked});
},
render: function() {
var text = this.state.liked ? 'like' : 'haven\'t liked';
var text = this.state.liked ? 'liked' : 'haven\'t liked';
return (
<p onClick={this.handleClick}>
You {text} this. Click to toggle.

6
docs/03-interactivity-and-dynamic-uis.ru-RU.md
View File

@@ -19,7 +19,7 @@ var LikeButton = React.createClass({
this.setState({liked: !this.state.liked});
},
render: function() {
var text = this.state.liked ? 'like' : 'haven\'t liked';
var text = this.state.liked ? 'liked' : 'haven\'t liked';
return (
<p onClick={this.handleClick}>
You {text} this. Click to toggle.
@@ -63,10 +63,10 @@ React считает интерфейсы обыкновенными конеч
**Старайтесь делать компоненты без состояния.** Следуя этому правилу, вы будете выносить работу с состоянием с уровня представления в другие, более подходящие места. Тем самым, вы снизите сложность приложения, упрощая его понимание.
Основной принцип такой: создаются несколько компонентов без состояния, которые формируют дерево. Они будут заниматься только отрисовкой данных. А все данные для них будут у родительского компонента, который будет на вершине этого дерева компонентов. Он и будет передавать данные дочерним узлам через `props`. Этот компонент с общим состоянием содержит в себе всю логику взаимодействия, а дочерние компоненты будут только отрисовывать данные, которые будут у них в `props`.
## Какие данные *надо* помещать в состояние?
**Состояние должно содержать данные, которые нужны для обновления интерфейса.** В реальных приложениях такие данные, как правило, незначительны по объему, и могут быть сериализованы в JSON. Когда вы создаете компонент с состоянием, старайтесь поместить в него минимум данных. А уже внутри метода `render()` вычисляйте остальные данные, используя значения из состояния.
**Состояние должно содержать данные, которые нужны для обновления интерфейса.** В реальных приложениях такие данные, как правило, незначительны по объему, и могут быть сериализованы в JSON. Когда вы создаете компонент с состоянием, старайтесь поместить в него минимум данных. А уже внутри метода `render()` вычисляйте остальные данные, используя значения из состояния.
Со временем вы увидите, что такой подход позволяет создавать более стройные и устойчивые к изменениям приложения. Добавление в состояние лишних данных требует от вас дополнительных затрат на их синхронизацию. Но этого можно избежать, если позволить React делать все эти вычисления за вас.
## Какие данные *не надо* помещать в состояние?

2
docs/03-interactivity-and-dynamic-uis.zh-CN.md
View File

@@ -19,7 +19,7 @@ var LikeButton = React.createClass({
this.setState({liked: !this.state.liked});
},
render: function() {
var text = this.state.liked ? 'like' : 'haven\'t liked';
var text = this.state.liked ? 'liked' : 'haven\'t liked';
return (
<p onClick={this.handleClick}>
You {text} this. Click to toggle.