diff --git a/content/docs/nav.yml b/content/docs/nav.yml
index c724c1d92..570f004bf 100644
--- a/content/docs/nav.yml
+++ b/content/docs/nav.yml
@@ -20,7 +20,7 @@
- id: components-and-props
title: Componenti e Props
- id: state-and-lifecycle
- title: State and Lifecycle
+ title: State e Lifecycle
- id: handling-events
title: Gestione degli Eventi
- id: conditional-rendering
diff --git a/content/docs/reference-react-component.md b/content/docs/reference-react-component.md
index eead9fdae..abbbb8f79 100644
--- a/content/docs/reference-react-component.md
+++ b/content/docs/reference-react-component.md
@@ -563,7 +563,7 @@ this.setState((state) => {
For more detail, see:
-* [State and Lifecycle guide](/docs/state-and-lifecycle.html)
+* [State e Lifecycle](/docs/state-and-lifecycle.html)
* [In depth: When and why are `setState()` calls batched?](https://stackoverflow.com/a/48610973/458193)
* [In depth: Why isn't `this.state` updated immediately?](https://github.com/facebook/react/issues/11527#issuecomment-360199710)
@@ -637,6 +637,6 @@ The state contains data specific to this component that may change over time. Th
If some value isn't used for rendering or data flow (for example, a timer ID), you don't have to put it in the state. Such values can be defined as fields on the component instance.
-See [State and Lifecycle](/docs/state-and-lifecycle.html) for more information about the state.
+See [State e Lifecycle](/docs/state-and-lifecycle.html) for more information about the state.
Never mutate `this.state` directly, as calling `setState()` afterwards may replace the mutation you made. Treat `this.state` as if it were immutable.
diff --git a/content/docs/state-and-lifecycle.md b/content/docs/state-and-lifecycle.md
index e9b6b92f5..189281054 100644
--- a/content/docs/state-and-lifecycle.md
+++ b/content/docs/state-and-lifecycle.md
@@ -1,6 +1,6 @@
---
id: state-and-lifecycle
-title: State and Lifecycle
+title: State e Lifecycle
permalink: docs/state-and-lifecycle.html
redirect_from:
- "docs/interactivity-and-dynamic-uis.html"
@@ -8,16 +8,16 @@ prev: components-and-props.html
next: handling-events.html
---
-This page introduces the concept of state and lifecycle in a React component. You can find a [detailed component API reference here](/docs/react-component.html).
+Questa pagina introduce il concetto di *state* (stato) e *lifecycle* (ciclo di vita) in un componente React. Puoi trovare un [riferimento dettagliato alle API dei componenti qui](/docs/react-component.html).
-Consider the ticking clock example from [one of the previous sections](/docs/rendering-elements.html#updating-the-rendered-element). In [Renderizzare Elementi](/docs/rendering-elements.html#rendering-an-element-into-the-dom), we have only learned one way to update the UI. We call `ReactDOM.render()` to change the rendered output:
+Considera l'esempio dell'orologio di [una delle sezioni precedenti](/docs/rendering-elements.html#updating-the-rendered-element). In [Renderizzare Elementi](/docs/rendering-elements.html#rendering-an-element-into-the-dom), abbiamo appreso solamente un modo per aggiornare la UI. Chiamiamo `ReactDOM.render()` per cambiare l'output renderizzato:
```js{8-11}
function tick() {
const element = (
-
Hello, world!
- It is {new Date().toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {new Date().toLocaleTimeString()}.
);
ReactDOM.render(
@@ -29,18 +29,18 @@ function tick() {
setInterval(tick, 1000);
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/gwoJZk?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/gwoJZk?editors=0010)
-In this section, we will learn how to make the `Clock` component truly reusable and encapsulated. It will set up its own timer and update itself every second.
+In questa sezione, apprenderemo come rendere il componente `Clock` davvero riutilizzabile ed incapsulato. Esso si occuperà di impostare il proprio timer e di aggiornarsi ogni secondo.
-We can start by encapsulating how the clock looks:
+Possiamo iniziare incapsulando l'aspetto dell'orologio:
```js{3-6,12}
function Clock(props) {
return (
-
Hello, world!
- It is {props.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {props.date.toLocaleTimeString()}.
);
}
@@ -55,11 +55,11 @@ function tick() {
setInterval(tick, 1000);
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/dpdoYR?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/dpdoYR?editors=0010)
-However, it misses a crucial requirement: the fact that the `Clock` sets up a timer and updates the UI every second should be an implementation detail of the `Clock`.
+Tuttavia, manca un requisito fondamentale: il fatto che `Clock` imposti un timer ed aggiorni la propria UI ogni secondo dovrebbe essere un dettaglio implementativo di `Clock`.
-Ideally we want to write this once and have the `Clock` update itself:
+Idealmente, vorremmo scrivere il seguente codice una volta sola, ed ottenere che `Clock` si aggiorni da solo:
```js{2}
ReactDOM.render(
@@ -68,65 +68,65 @@ ReactDOM.render(
);
```
-To implement this, we need to add "state" to the `Clock` component.
+Per implementare ciò, abbiamo bisogno di aggiungere uno "stato" al componente `Clock`.
-State is similar to props, but it is private and fully controlled by the component.
+Lo state (o stato) è simile alle props, ma è privato e completamente controllato dal componente.
-We [mentioned before](/docs/components-and-props.html#functional-and-class-components) that components defined as classes have some additional features. Local state is exactly that: a feature available only to classes.
+Abbiamo [detto in precedenza](/docs/components-and-props.html#functional-and-class-components) che i componenti definiti come classi hanno alcune funzionalità aggiuntive. Il local state (stato locale) è esattamente una di queste: una caratteristica disponibile solo nelle classi.
-## Converting a Function to a Class {#converting-a-function-to-a-class}
+## Convertire una Funzione in una Classe {#converting-a-function-to-a-class}
-You can convert a function component like `Clock` to a class in five steps:
+Puoi convertire un componente funzione come `Clock` in una classe in cinque passaggi:
-1. Create an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes), with the same name, that extends `React.Component`.
+1. Crea una [classe ES6](https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Classes), con lo stesso nome, che estende `React.Component`.
-2. Add a single empty method to it called `render()`.
+2. Aggiungi un singolo metodo vuoto chiamato `render()`.
-3. Move the body of the function into the `render()` method.
+3. Sposta il corpo della funzione all'interno del metodo `render()`.
-4. Replace `props` with `this.props` in the `render()` body.
+4. Sostituisci `props` con `this.props` nel corpo del metodo `render()`.
-5. Delete the remaining empty function declaration.
+5. Rimuovi la dichiarazione della funzione rimasta vuota.
```js
class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.props.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.props.date.toLocaleTimeString()}.
);
}
}
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/zKRGpo?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/zKRGpo?editors=0010)
-`Clock` is now defined as a class rather than a function.
+`Clock` è ora definito da una classe, invece che da una funzione.
-The `render` method will be called each time an update happens, but as long as we render `` into the same DOM node, only a single instance of the `Clock` class will be used. This lets us use additional features such as local state and lifecycle methods.
+Il metodo `render` viene invocato ogni volta che si verifica un aggiornamento, ma finché renderizziamo `` nello stesso nodo del DOM, verrà utilizzata un'unica istanza della classe `Clock`. Questo ci consente di utilizzare funzionalità aggiuntive come il local state e i metodi del lifecycle del componente.
-## Adding Local State to a Class {#adding-local-state-to-a-class}
+## Aggiungere il Local State ad una Classe {#adding-local-state-to-a-class}
-We will move the `date` from props to state in three steps:
+Sposteremo `date` dalle props allo state in tre passaggi:
-1) Replace `this.props.date` with `this.state.date` in the `render()` method:
+1) Sostituisci `this.props.date` con `this.state.date` nel metodo `render()`:
```js{6}
class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.state.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.state.date.toLocaleTimeString()}.
);
}
}
```
-2) Add a [class constructor](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes#Constructor) that assigns the initial `this.state`:
+2) Aggiungi un [costruttore di classe](https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Classes#Costruttore) che assegna il valore iniziale di `this.state`:
```js{4}
class Clock extends React.Component {
@@ -138,15 +138,15 @@ class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.state.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.state.date.toLocaleTimeString()}.
);
}
}
```
-Note how we pass `props` to the base constructor:
+Nota come passiamo `props` al costruttore di base:
```js{2}
constructor(props) {
@@ -155,9 +155,9 @@ Note how we pass `props` to the base constructor:
}
```
-Class components should always call the base constructor with `props`.
+I componenti classe dovrebbero sempre chiamare il costruttore base passando `props` come argomento.
-3) Remove the `date` prop from the `` element:
+3) Rimuovi la prop `date` dall'elemento ``:
```js{2}
ReactDOM.render(
@@ -166,9 +166,9 @@ ReactDOM.render(
);
```
-We will later add the timer code back to the component itself.
+In seguito ci occuperemo di aggiungere la parte di codice relativa al timer all'interno del componente stesso.
-The result looks like this:
+Il risultato dovrebbe avere questo aspetto:
```js{2-5,11,18}
class Clock extends React.Component {
@@ -180,8 +180,8 @@ class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.state.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.state.date.toLocaleTimeString()}.
);
}
@@ -193,19 +193,19 @@ ReactDOM.render(
);
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/KgQpJd?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/KgQpJd?editors=0010)
-Next, we'll make the `Clock` set up its own timer and update itself every second.
+Adesso, faremo in modo che `Clock` imposti il proprio timer e si aggiorni ogni secondo.
-## Adding Lifecycle Methods to a Class {#adding-lifecycle-methods-to-a-class}
+## Aggiungere Metodi di Lifecycle ad una Classe {#adding-lifecycle-methods-to-a-class}
-In applications with many components, it's very important to free up resources taken by the components when they are destroyed.
+Nelle applicazioni con molti componenti, è molto importante rilasciare le risorse occupate dai componenti quando questi vengono distrutti.
-We want to [set up a timer](https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval) whenever the `Clock` is rendered to the DOM for the first time. This is called "mounting" in React.
+Nel nostro caso, vogliamo [impostare un timer](https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval) ogni volta che `Clock` è renderizzato nel DOM per la prima volta. Questo è definito "mounting" ("montaggio") in React.
-We also want to [clear that timer](https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/clearInterval) whenever the DOM produced by the `Clock` is removed. This is called "unmounting" in React.
+Vogliamo anche [cancellare il timer](https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/clearInterval) ogni volta che il DOM prodotto da `Clock` viene rimosso. Questo è definito "unmounting" ("smontaggio") in React.
-We can declare special methods on the component class to run some code when a component mounts and unmounts:
+Possiamo dichiarare alcuni metodi speciali nel componente classe per eseguire del codice quando il componente viene montato e smontato:
```js{7-9,11-13}
class Clock extends React.Component {
@@ -225,17 +225,17 @@ class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.state.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.state.date.toLocaleTimeString()}.
);
}
}
```
-These methods are called "lifecycle methods".
+Questi metodi sono chiamati "metodi del lifecycle" (metodi del ciclo di vita).
-The `componentDidMount()` method runs after the component output has been rendered to the DOM. This is a good place to set up a timer:
+Il metodo `componentDidMount()` viene eseguito dopo che l'output del componente è stato renderizzato nel DOM. È un buon punto in cui impostare un timer:
```js{2-5}
componentDidMount() {
@@ -246,11 +246,11 @@ The `componentDidMount()` method runs after the component output has been render
}
```
-Note how we save the timer ID right on `this`.
+Nota come salviamo l'ID del timer direttamente in `this`.
-While `this.props` is set up by React itself and `this.state` has a special meaning, you are free to add additional fields to the class manually if you need to store something that doesn’t participate in the data flow (like a timer ID).
+Mentre `this.props` viene impostato da React stesso e `this.state` ha un significato speciale, sei libero di aggiungere altri campi alla classe se hai bisogno di salvare qualcosa che non partecipa al flusso dei dati (come l'ID di un timer).
-We will tear down the timer in the `componentWillUnmount()` lifecycle method:
+Ci occuperemo di cancellare il timer nel metodo del lifecycle `componentWillUnmount()`:
```js{2}
componentWillUnmount() {
@@ -258,9 +258,9 @@ We will tear down the timer in the `componentWillUnmount()` lifecycle method:
}
```
-Finally, we will implement a method called `tick()` that the `Clock` component will run every second.
+Infine, implementeremo un metodo chiamato `tick()` che verrà invocato dal componente `Clock` ogni secondo.
-It will use `this.setState()` to schedule updates to the component local state:
+Il nuovo metodo utilizzerà `this.setState()` per pianificare gli aggiornamenti al local state del componente:
```js{18-22}
class Clock extends React.Component {
@@ -289,8 +289,8 @@ class Clock extends React.Component {
render() {
return (
-
Hello, world!
- It is {this.state.date.toLocaleTimeString()}.
+ Ciao, mondo!
+ Sono le {this.state.date.toLocaleTimeString()}.
);
}
@@ -302,72 +302,72 @@ ReactDOM.render(
);
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/amqdNA?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/amqdNA?editors=0010)
-Now the clock ticks every second.
+In questo modo l'orologio scatta ogni secondo.
-Let's quickly recap what's going on and the order in which the methods are called:
+Ricapitoliamo velocemente quello che sta succedendo e l'ordine con cui i metodi sono invocati:
-1) When `` is passed to `ReactDOM.render()`, React calls the constructor of the `Clock` component. Since `Clock` needs to display the current time, it initializes `this.state` with an object including the current time. We will later update this state.
+1) Quando `` viene passato a `ReactDOM.render()`, React invoca il costruttore del componente `Clock`. Dal momento che `Clock` ha bisogno di mostrare l'ora corrente, inizializza `this.state` con un oggetto che include l'ora corrente. In seguito, aggiorneremo questo state.
-2) React then calls the `Clock` component's `render()` method. This is how React learns what should be displayed on the screen. React then updates the DOM to match the `Clock`'s render output.
+2) In seguito, React invoca il metodo `render()` del componente `Clock`. Questo è il modo in cui React apprende cosa dovrebbe essere visualizzato sullo schermo. React si occupa di aggiornare il DOM in modo da farlo corrispondere all'output della renderizzazione di `Clock`.
-3) When the `Clock` output is inserted in the DOM, React calls the `componentDidMount()` lifecycle method. Inside it, the `Clock` component asks the browser to set up a timer to call the component's `tick()` method once a second.
+3) Quando l'output della renderizzazione di `Clock` viene inserito nel DOM, React invoca il metodo del lifecycle `componentDidMount()`. Al suo interno, il componente `Clock` chiede al browser di impostare un timer con cui invocare il metodo `tick()` del componente una volta al secondo.
-4) Every second the browser calls the `tick()` method. Inside it, the `Clock` component schedules a UI update by calling `setState()` with an object containing the current time. Thanks to the `setState()` call, React knows the state has changed, and calls the `render()` method again to learn what should be on the screen. This time, `this.state.date` in the `render()` method will be different, and so the render output will include the updated time. React updates the DOM accordingly.
+4) Ogni secondo, il browser invoca il metodo `tick()`. Al suo interno, il componente `Clock` pianifica un aggiornamento della UI invocando `setState()` con un oggetto che contiene la nuova ora corrente. Grazie alla chiamata a `setState()`, React viene informato del fatto che lo state è cambiato e invoca di nuovo il metodo `render()` per sapere che cosa deve essere mostrato sullo schermo. Questa volta, `this.state.date` nel metodo `render()` avrà un valore differente, di conseguenza l'output della renderizzazione includerà l'orario aggiornato. React aggiorna il DOM di conseguenza.
-5) If the `Clock` component is ever removed from the DOM, React calls the `componentWillUnmount()` lifecycle method so the timer is stopped.
+5) Se il componente `Clock` dovesse mai essere rimosso dal DOM, React invocherebbe il metodo del lifecycle `componentWillUnmount()` ed il timer verrebbe cancellato.
-## Using State Correctly {#using-state-correctly}
+## Utilizzare Correttamente lo Stato {#using-state-correctly}
-There are three things you should know about `setState()`.
+Ci sono tre cose che devi sapere a proposito di `setState()`.
-### Do Not Modify State Directly {#do-not-modify-state-directly}
+### Non Modificare lo Stato Direttamente {#do-not-modify-state-directly}
-For example, this will not re-render a component:
+Per esempio, questo codice non farebbe ri-renderizzare un componente:
```js
// Wrong
this.state.comment = 'Hello';
```
-Instead, use `setState()`:
+Devi invece utilizzare `setState()`:
```js
// Correct
this.setState({comment: 'Hello'});
```
-The only place where you can assign `this.state` is the constructor.
+L'unico punto in cui puoi assegnare direttamente un valore a `this.state` è nel costruttore.
-### State Updates May Be Asynchronous {#state-updates-may-be-asynchronous}
+### Gli Aggiornamenti di Stato Potrebbero Essere Asincroni {#state-updates-may-be-asynchronous}
-React may batch multiple `setState()` calls into a single update for performance.
+React potrebbe accorpare più chiamate a `setState()` in un unico aggiornamento per migliorare la performance.
-Because `this.props` and `this.state` may be updated asynchronously, you should not rely on their values for calculating the next state.
+Poiché `this.props` e `this.state` potrebbero essere aggiornate in modo asincrono, non dovresti basarti sul loro valore per calcolare lo stato successivo.
-For example, this code may fail to update the counter:
+Ad esempio, questo codice potrebbe non riuscire ad aggiornare correttamente il contatore:
```js
-// Wrong
+// Sbagliato
this.setState({
counter: this.state.counter + this.props.increment,
});
```
-To fix it, use a second form of `setState()` that accepts a function rather than an object. That function will receive the previous state as the first argument, and the props at the time the update is applied as the second argument:
+Per effettuare correttamente questa operazione, bisogna utilizzare una seconda forma di `setState()` che accetta in input una funzione invece che un oggetto. Quella funzione riceverà come primo argomento lo stato precedente e come secondo argomento le proprietà, aggiornate al momento in cui l'aggiornamento di stato è applicato:
```js
-// Correct
+// Giusto
this.setState((state, props) => ({
counter: state.counter + props.increment
}));
```
-We used an [arrow function](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions) above, but it also works with regular functions:
+Qui abbiamo utilizzato una [arrow function](https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Functions_and_function_scope/Arrow_functions), ma puoi utilizzare anche una funzione tradizionale:
```js
-// Correct
+// Giusto
this.setState(function(state, props) {
return {
counter: state.counter + props.increment
@@ -375,11 +375,11 @@ this.setState(function(state, props) {
});
```
-### State Updates are Merged {#state-updates-are-merged}
+### Gli Aggiornamenti di Stato Vengono Applicati Tramite Merge {#state-updates-are-merged}
-When you call `setState()`, React merges the object you provide into the current state.
+Quando chiami `setState()`, React effettua il merge dell'oggetto che fornisci nello state corrente.
-For example, your state may contain several independent variables:
+Ad esempio, il tuo state potrebbe contenere molte variabili indipendenti:
```js{4,5}
constructor(props) {
@@ -391,7 +391,7 @@ For example, your state may contain several independent variables:
}
```
-Then you can update them independently with separate `setState()` calls:
+A questo punto puoi aggiornarle indipendentemente con invocazioni separate del metodo `setState()`:
```js{4,10}
componentDidMount() {
@@ -409,41 +409,41 @@ Then you can update them independently with separate `setState()` calls:
}
```
-The merging is shallow, so `this.setState({comments})` leaves `this.state.posts` intact, but completely replaces `this.state.comments`.
+Quello che viene effettuato è uno ["shallow merge"](https://stackoverflow.com/questions/42731453/deep-and-shallow-merge-in-javascript), quindi `this.setState({comments})` lascia intatto `this.state.posts`, ma sostituisce completamente `this.state.comments`.
-## The Data Flows Down {#the-data-flows-down}
+## I Dati Fluiscono Verso il Basso {#the-data-flows-down}
-Neither parent nor child components can know if a certain component is stateful or stateless, and they shouldn't care whether it is defined as a function or a class.
+Né i componenti genitori né i componenti figli possono sapere se un certo componente è "stateful" o "stateless" (cioè se è dotato o meno di stato) e non dovrebbero preoccuparsi del fatto di essere definiti come funzione o come classe.
-This is why state is often called local or encapsulated. It is not accessible to any component other than the one that owns and sets it.
+Questa è la ragione per cui lo stato è spesso definito locale o incapsulato. Esso non è accessibile a nessun componente a parte quello a cui appartiene.
-A component may choose to pass its state down as props to its child components:
+Un componente potrebbe decidere di passare il suo stato ai componenti figli sotto forma di props:
```js
-It is {this.state.date.toLocaleTimeString()}.
+Sono le {this.state.date.toLocaleTimeString()}.
```
-This also works for user-defined components:
+Questo funziona anche con i componenti definiti dall'utente:
```js
```
-The `FormattedDate` component would receive the `date` in its props and wouldn't know whether it came from the `Clock`'s state, from the `Clock`'s props, or was typed by hand:
+Il componente `FormattedDate` riceve `date` nelle sue props e non può sapere se viene dallo state di `Clock`, dalle proprietà di `Clock` o se è stato inserito a mano:
```js
function FormattedDate(props) {
- return It is {props.date.toLocaleTimeString()}.
;
+ return Sono le {props.date.toLocaleTimeString()}.
;
}
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/zKRqNB?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/zKRqNB?editors=0010)
-This is commonly called a "top-down" or "unidirectional" data flow. Any state is always owned by some specific component, and any data or UI derived from that state can only affect components "below" them in the tree.
+Questo è spesso definito flusso di dati "top-down" (dall'alto verso il basso) o "unidirezionale". In questo paradigma, lo stato è sempre posseduto da uno specifico componente, e tutti i dati o la UI derivati da quello stato possono influenzare solamente i componenti "più in basso" nell'albero.
-If you imagine a component tree as a waterfall of props, each component's state is like an additional water source that joins it at an arbitrary point but also flows down.
+Se immagini un albero di componenti come una cascata di props, puoi pensare allo stato di ciascun componente come a una sorgente d'acqua aggiuntiva che si unisce alla cascata in un punto qualsiasi e flusice verso il basso insieme al resto dell'acqua.
-To show that all components are truly isolated, we can create an `App` component that renders three ``s:
+Per mostrare che tutti i componenti sono davvero isolati, possiamo creare un componente `App` che renderizza tre ``:
```js{4-6}
function App() {
@@ -462,8 +462,8 @@ ReactDOM.render(
);
```
-[**Try it on CodePen**](https://codepen.io/gaearon/pen/vXdGmd?editors=0010)
+[**Prova su CodePen**](https://codepen.io/gaearon/pen/vXdGmd?editors=0010)
-Each `Clock` sets up its own timer and updates independently.
+Ciascun `Clock` imposta il proprio timer e si aggiorna indipendentemente dagli altri.
-In React apps, whether a component is stateful or stateless is considered an implementation detail of the component that may change over time. You can use stateless components inside stateful components, and vice versa.
+Nelle applicazioni React, il fatto che un componente sia stateful o stateless è considerato un dettaglio implementativo di quel componente, che potrebbe cambiare nel tempo. Puoi utilizzare componenti stateless all'interno di componenti stateful, e viceversa.