{"patch":"diff --git a\/docs\/tips\/03-if-else-in-JSX.ru-RU.md b\/docs\/tips\/03-if-else-in-JSX.ru-RU.md\nnew file mode 100644\nindex 0000000000..722e6381cc\n--- \/dev\/null\n+++ b\/docs\/tips\/03-if-else-in-JSX.ru-RU.md\n@@ -0,0 +1,81 @@\n+---\n+id: if-else-in-JSX\n+title: If-Else в JSX\n+layout: tips\n+permalink: tips\/if-else-in-JSX-ru-RU.html\n+prev: inline-styles-ru-RU.html\n+next: self-closing-tag.html\n+---\n+\n+Некоторые конструкции, такие как `if-else`, нельзя использовать внутри JSX, так как JSX в результате преобразуется в вызов функции JS, как показано в примере:\n+\n+```js\n+\/\/ JSX:\n+ReactDOM.render(

Hello World!<\/div>, mountNode);\n+\n+\/\/ Преобразованный в JS:\n+ReactDOM.render(React.createElement(\"div\", {id:\"msg\"}, \"Hello World!\"), mountNode);\n+```\n+\n+Это означает что оператор `if` нельзя встроить таким образом:\n+\n+```js\n+\/\/ JSX:\n+

Hello World!<\/div>\n+\n+\/\/ Преобразованный в JS:\n+React.createElement(\"div\", {id: if (condition) { 'msg' }}, \"Hello World!\");\n+```\n+\n+В результате преобразования получается неверный JS код. В таких случаях используется тернарный условный оператор:\n+\n+```js\n+ReactDOM.render(

Hello World!<\/div>, mountNode);\n+```\n+\n+Если тернарного оператора недостаточно, вы можете вынести оператор `if`, определяющий выбор компонентов, вне JSX:\n+\n+```js\n+var loginButton;\n+if (loggedIn) {\n+ loginButton = ;\n+} else {\n+ loginButton = ;\n+}\n+\n+return (\n+

\n+ \n+ {loginButton}\n+ <\/nav>\n+);\n+```\n+\n+Также вы можете обернуть код в [немедленно вызываемую функцию](https:\/\/en.wikipedia.org\/wiki\/Immediately-invoked_function_expression) и расположить её _внутри_ JSX.\n+\n+```js\n+return (\n+

\n+

Color<\/h1>\n+

Name<\/h3>\n+
{this.state.color || \"white\"}<\/p>\n+

Hex<\/h3>\n+
\n+ {(() => {\n+ switch (this.state.color) {\n+ case \"red\": return \"#FF0000\";\n+ case \"green\": return \"#00FF00\";\n+ case \"blue\": return \"#0000FF\";\n+ default: return \"#FFFFFF\";\n+ }\n+ })()}\n+ <\/p>\n+ <\/section>\n+);\n+```\n+\n+> Примечание:\n+>\n+> В приведенном выше примере, используется [функция-стрелка](https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Functions\/Arrow_functions) из ES6 для связи со значением `this`.\n+\n+Вы можете попробовать этот синтаксис внутри [Babel REPL](https:\/\/babeljs.io\/repl\/).\n","commit":{"revision":"79367b09f76fcd12d537dada51c44d01301dbab5","shortRevision":"79367b09f7","authoredAt":"2016-09-14T15:05:21+03:00","authorEmail":"ivanzotov@gmail.com","subject":"Russian translation if-else in JSX of tips (#7726)","authorName":"Ivan Zotov"},"parents":["fcc37ccaa2f10a3fbbe6a2852c3309a98ad486bd"],"body":"","files":[{"path":"docs\/tips\/03-if-else-in-JSX.ru-RU.md","status":"A"}]}

dillon1000/react

Files changed