From e9f2daea304dc7b087a3f8d8912a852690ab3ed7 Mon Sep 17 00:00:00 2001 From: karpiuMG Date: Fri, 10 Jan 2020 12:55:24 +0100 Subject: [PATCH 1/9] Update uncontrolled-components.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Uwagi: Ostatni przykład kodu, który tyczy się obsługi plików, był załączany poprzez `embed`, a nie tak jak pierwszy przykład, napisany i otoczony przez "```javascript{5,9,18}". Zrezygnowałem z `embed`, aby móc wprowadzić tłumaczenia w kodzie. Mam nadzieję, że --- content/docs/uncontrolled-components.md | 72 ++++++++++++++++++------- 1 file changed, 53 insertions(+), 19 deletions(-) diff --git a/content/docs/uncontrolled-components.md b/content/docs/uncontrolled-components.md index 54b729e96..4a5eeda9b 100644 --- a/content/docs/uncontrolled-components.md +++ b/content/docs/uncontrolled-components.md @@ -1,14 +1,14 @@ --- id: uncontrolled-components -title: Uncontrolled Components +title: Komponenty niekontrolowane permalink: docs/uncontrolled-components.html --- -In most cases, we recommend using [controlled components](/docs/forms.html#controlled-components) 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. +W większości przypadków zalecamy stosowanie [komponentów kontrolowanych](/docs/forms.html#controlled-components) do implementacji formularzy. W komponencie kontrolowanym, dane formularza są obsługiwane przez komponent reactowy. Alternatywą są komponenty niekontrolowane, w których dane formularza są obsługiwane przez sam 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. +Aby stworzyć komponent niekontrolowany, zamiast pisać funkcję obsługującą każdą zmianę stanu, możesz [użyć polecenia ref](/docs/refs-and-the-dom.html), aby uzyskać wartości formularza z DOM. -For example, this code accepts a single name in an uncontrolled component: +Na przykład, ten kod akceptuje pojedynczą nazwę w komponencie niekontrolowanym: ```javascript{5,9,18} class NameForm extends React.Component { @@ -19,7 +19,7 @@ class NameForm extends React.Component { } handleSubmit(event) { - alert('A name was submitted: ' + this.input.current.value); + alert('Podano następujące imię: ' + this.input.current.value); event.preventDefault(); } @@ -27,10 +27,10 @@ class NameForm extends React.Component { return (
- +
); } @@ -39,46 +39,80 @@ class NameForm extends React.Component { [**Try it on 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. +Ponieważ komponent niekontrolowany zachowuje źródło prawdy w DOM, czasami łatwiej jest zintegrować kod reactowy z kodem niereactowym, gdy używa się komponentów niekontrolowanych. Dzięki temu może pojawić się również nieco mniej kodu, jeśli chcesz podejść do tematu z grubsza. W przeciwnym razie zwykle powinieneś używać komponentów kontrolowanych. -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. +Jeśli nadal nie jest jasne, jakiego rodzaju komponentu należy użyć w konkretnej sytuacji, pomocny może okazać się [ten artykuł o kontrolowanych i niekontrolowanych danych wejściowych](https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/). -### Default Values {#default-values} +### Wartości domyślne {#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`. +W reactowym cyklu życia renderowania wartość atrybutu `value` przypisanego do elementów formularza zastąpi wartość w DOM. W przypadku komponentu niekontrolowanego często chcesz, aby React określił wartość początkową, ale kolejne aktualizacje pozostają niekontrolowane. Aby obsłużyć ten przypadek, zamiast atrybutu `value` można podać atrybut `defaultValue`. ```javascript{7} render() { return (
- +
); } ``` -Likewise, `` and `` support `defaultChecked`, and `