From f9d6ccddf5df3c8655a175b00a286cc7d56ad658 Mon Sep 17 00:00:00 2001 From: Itay Yehezkel Date: Tue, 1 Oct 2019 00:07:01 +0300 Subject: [PATCH 1/2] add uncontrolled components --- content/docs/uncontrolled-components.md | 28 ++++++++++++------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/content/docs/uncontrolled-components.md b/content/docs/uncontrolled-components.md index 10b6eab28..0d2838984 100644 --- a/content/docs/uncontrolled-components.md +++ b/content/docs/uncontrolled-components.md @@ -1,14 +1,14 @@ --- id: uncontrolled-components -title: Uncontrolled Components +title: קומפוננטות לא מבוקרות permalink: docs/uncontrolled-components.html --- -In most cases, we recommend using [controlled components](/docs/forms.html) to implement forms. In a controlled component, form data is handled by a React component. The alternative is uncontrolled components, where form data is handled by the DOM itself. +ברוב המקרים, אנו ממליצים להשתמש [בקומפוננטות מבוקרות](/docs/forms.html) למימוש טפסים. בקומפוננטה מבוקרת, נתוני הטופס מנוהלים על ידי קומפוננטת React. האלטרנטיבה היא קומפוננטה לא מבוקרת, איפה שנתוני הטופס מנוהלים על ידי ה-DOM עצמו. -To write an uncontrolled component, instead of writing an event handler for every state update, you can [use a ref](/docs/refs-and-the-dom.html) to get form values from the DOM. +כדי לכתוב קומפוננטה לא מבוקרת, במקום לרשום event handler לכל עדכון state, אתה יכול [להשתמש ב-ref](/docs/refs-and-the-dom.html) כדי לקבל את ערכי הטופס מה-DOM. -For example, this code accepts a single name in an uncontrolled component: +לדוגמא, הקוד הזה מקבל שם יחיד בקומפוננטה לא מבוקרת: ```javascript{5,9,18} class NameForm extends React.Component { @@ -37,15 +37,15 @@ class NameForm extends React.Component { } ``` -[**Try it on CodePen**](https://codepen.io/gaearon/pen/WooRWa?editors=0010) +[**נסו זאת ב-CodePen**](https://codepen.io/gaearon/pen/WooRWa?editors=0010) -Since an uncontrolled component keeps the source of truth in the DOM, it is sometimes easier to integrate React and non-React code when using uncontrolled components. It can also be slightly less code if you want to be quick and dirty. Otherwise, you should usually use controlled components. +מכיוון קומפוננטה לא מבוקרת שומרת את מקור האמת ב-DOM, לפעמיים זה קל יותר לשלב React ולא React קוד מתי שמשתמשים בקומפוננטה לא מבוקרת. זה גם יכול להיות מעט קוד אם אתה רוצה להיות מהיר ומלוכלך, אחרת, אתה צריך קומפוננטה מבוקרת. -If it's still not clear which type of component you should use for a particular situation, you might find [this article on controlled versus uncontrolled inputs](https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/) to be helpful. +אם זה עדיין לא ברור איזה סוג של קומפוננטה אתה צריך להשתמש בסיטואציה מסויימת, אתה עשוי למצוא את [המאמר הזה על קלט מבוקר נגד לא מבוקר](https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/) מאוד עוזר. -### Default Values {#default-values} +### ערכי ברירת מחדל {#default-values} -In the React rendering lifecycle, the `value` attribute on form elements will override the value in the DOM. With an uncontrolled component, you often want React to specify the initial value, but leave subsequent updates uncontrolled. To handle this case, you can specify a `defaultValue` attribute instead of `value`. +ברנדור מחזור החיים של React, התכונה `value` באלמנטי טופס ידרסו את הערך ב-DOM. עם קומפוננטה לא מבוקרת, לעיתים קרובות תרצה ש-React יספק את הערך הראשוני, אבל ישאיר את העדכונים הבאים לא מבוקרים. כדי לטפל במקרה כזה, אתה יכול לציין את תכונת `defaultValue` במקום `value` ```javascript{7} render() { @@ -64,19 +64,19 @@ render() { } ``` -Likewise, `` and `` support `defaultChecked`, and `