Skip to content

Commit a18bfe8

Browse files
author
Ludo237
committed
Improved Translation
Fixed some typos Added new way of spelling “Data binding” Refactor some errors
1 parent 4055118 commit a18bfe8

File tree

1 file changed

+9
-9
lines changed

1 file changed

+9
-9
lines changed

src/guide/overview.md

+9-9
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@ type: guida
44
order: 2
55
---
66

7-
Vue.js (pronunciato /vjuː/, come **view** in inglese) è una libreria che si pone lo scopo di costruire interfacce web interattive. L'obbiettivo di Vue.js è quello di offire i benefici che derivano dal **vincolo di dati reattivo** e dai **componenti riutilizzabili per le viste** con delle API più semplici possibili.
7+
Vue.js (pronunciato /vjuː/, come **view** in inglese) è una libreria che si pone lo scopo di costruire interfacce web interattive. L'obbiettivo di Vue.js è quello di offire i benefici che derivano dal **binding reattivo dei dati** e dai **componenti riutilizzabili per le viste** con delle API più semplici possibili.
88

99
Vue.js non è un framework completo - è solo improntato alla gestione dello strato delle viste. Questo d'altronde lo rende facilmente integrabile con altri framework o librerie già esistenti. In altre parole Vue.js, quando utilizzato con altri strumenti adeguati, vi aiuta a creare Applicazioni Web a Pagina Singola sofisticate e complesse.
1010

1111
Se hai esperienza nello sviluppo di interfacce web e vuoi capire meglio come Vue.js si differenzi da altre librerie/framework puoi controllare la [Comparazione con gli Altri Framework](comparison.html); Se sei più interessato a capire come Vue.js si approcci allo sviluppo di Applicazioni Scalabili allora controlla la sezione [Costruire Applicazioni Scalabili](application.html).
1212

13-
## Vincolo di Dati Reattivo
13+
## Binding reattivo dei dati
1414

15-
Il fulcro di Vue.js si basa sul Vincolo di Dati Reattivo, tale vincolo rende estremamente semplice mantenere sincronizzati a dovere i dati all'interno del DOM. Quanto si usa jQuery per manipolare il DOM, tramite QueryDOM, il codice che si scrive il più delle volte diventa imperativo, ripetitivo e soggetto ad errori. Vue.js sfrutta il concetto delle **viste manipolate dai dati**. In parole semplici significa che sfruttiamo delle parole chiavi all'interno del codice HTML per "vincolare" il DOM ai dati sottostanti. Una volta che il vincolo è creato, il DOM verrà mantenuto in sincronizzazione con i dati. Ogni volta che modificherai i dati il DOM si aggiornerà di conseguenza, in automatico. Questo rendere il codice molto più semplice da scrivere, leggere e mantenere.
15+
Il fulcro di Vue.js si basa sul binding reattivo dei dati, tale vincolo rende estremamente semplice mantenere sincronizzati a dovere i dati all'interno del DOM. Quanto si usa jQuery, per esempio, per manipolare il DOM, tramite QueryDOM, il codice che si scrive il più delle volte diventa imperativo, ripetitivo e soggetto ad errori. Vue.js sfrutta il concetto delle **viste manipolate dai dati**. In parole semplici significa che sfruttiamo delle parole chiavi all'interno del codice HTML per "vincolare", o meglio legare, il DOM ai dati sottostanti forniti da Vue.js. Una volta che il binding è creato, il DOM verrà mantenuto in sincronizzazione con i dati. Ogni volta che modificherai i dati il DOM si aggiornerà di conseguenza, in automatico. Questo rendere il codice molto più semplice da scrivere, leggere e mantenere.
1616

1717
![MVVM](/images/mvvm.png)
1818

@@ -55,7 +55,7 @@ var exampleVM = new Vue({
5555

5656
Questo modo di operare sembra molto simile al rendering di template, ma Vue.js ha fatto tanto lavoro dietro le quinte. I dati e le viste (il DOM) sono ora collegati, ed il tutto è **reattivo**. Come lo sappiamo? Potete provare ad aprire la Console degli Sviluppatori del vostro browser, detta anche ispeziona elemento, e modificare la variabile `exampleData.name`. Se tutto è fatto a dovere dovreste vedere l'esempio sopra aggiornarsi di conseguenza alle vostre modifiche.
5757

58-
Da notare come non abbiamo dovuto scrivere nessun tipo di logica per manipolare il DOM: il template HTML, arricchito con i vincoli, è una mappa dichiarativa dello stato dei dati sottostanti, i quali sono solo degli oggetti in JavaScript. Le nostre viste sono interamente guidate dai dati.
58+
Da notare come non abbiamo dovuto scrivere nessun tipo di logica per manipolare il DOM: il template HTML, arricchito con i binding, è una mappa dichiarativa dello stato dei dati sottostanti, i quali sono solo degli oggetti in JavaScript. Le nostre viste sono interamente guidate dai dati.
5959

6060
Vediamo un secondo esemppio:
6161

@@ -88,15 +88,15 @@ var exampleVM2 = new Vue({
8888
</script>
8989
{% endraw %}
9090

91-
In questo esempio abbiamo visto qualcosa di relativamente nuovo. L'attributo `v-if` che vedete è chiamato **Direttiva**. Le Direttive hanno il prefisso `v-` per indicare che sono attributi speciali che Vue.js fornisce, avrete già capito perché, per applicare condizioni particolari al DOM. Provate voi stessi, come prima, cambiare il valore di `exampleVM2.greeting` a `false` tramite la console. Se tutto è fatto in maniera corretta dovreste vedere il messaggio "Ciao!" scomparire.
91+
In questo esempio abbiamo visto qualcosa di relativamente nuovo. L'attributo `v-if`, che vedremo più avanti, è chiamato **Direttiva**. Le Direttive hanno il prefisso `v-` per indicare che sono attributi speciali che Vue.js fornisce al DOM per applicare condizioni particolari. Provate voi stessi, come prima, a cambiare il valore di `exampleVM2.greeting` a `false` tramite la console. Se tutto è fatto in maniera corretta dovreste vedere il messaggio "Ciao!" scomparire.
9292

93-
Il secondo esempio è una dimostrazione di come non solo possiamo vincolare il DOM con i dati, ma possiamo anche vincolare la **struttura** del DOM in base ai dati. Vue.js fornisce anche un potente sistema di effetti transizioni applicabili quando si aggiungono/rimuovono elementi dal DOM.
93+
Il secondo esempio è una dimostrazione di come non solo possiamo vincolare il DOM con i dati, ma possiamo anche vincolare la **struttura** del DOM in base ai dati. Vue.js fornisce un potente sistema di effetti transizioni applicabili quando si aggiungono/rimuovono elementi dal DOM.
9494

95-
Ci sono molte altre direttive, ognuna ha delle caratteristiche speciali. Per esempio la direttiva `v-for` serve a visualizzare i dati di un Array, oppure la direttiva `v-bind` per vincolare attributi di un elemtno HTML. Discuteremo delle direttive in modo approfondito in un secondo momento più avanti.
95+
Ci sono molte altre direttive, ognuna delle quali ha delle caratteristiche speciali. Per esempio la direttiva `v-for` serve a visualizzare i dati di un Array, oppure la direttiva `v-bind` per vincolare attributi di un elemento HTML. Discuteremo delle direttive in modo approfondito più avanti.
9696

9797
## Sistema a Componenti
9898

99-
Il Sistema a Componenti è un altro concetto fondamentale in Vue.js, perché è una astrazione che ci aiuta a construire applicazioni su larga scala composte da piccoli componenti, isolati e riutilizzabili. Se ci pensiamo, quasi qualsiai interfaccia si può pensare come un albero di componenti:
99+
Il Sistema a Componenti è un altro concetto fondamentale in Vue.js, perché è una astrazione che ci aiuta a costruire applicazioni su larga scala composte da piccoli componenti, isolati e riutilizzabili. Se ci pensiamo, quasi qualsiasi interfaccia si può pensare come un albero a componenti:
100100

101101
![Albero a Componenti](/images/components.png)
102102

@@ -112,7 +112,7 @@ Difatti qualsiasi tipo di applicazione costruita con Vue.js verrà formata esatt
112112
</div>
113113
```
114114

115-
Come avrete notato i componenti di Vue.js sono molto simili ai **Componenti Personalizzati** che fanno parte della [Specifica sui Componenti Web](http://www.w3.org/wiki/WebComponents/). Difatti, la sintassi dei componenti Vue.js è fatta ad immagine e somiglianza di quelle specifiche. Per esempio implementano le così detta [Slot API](https://github.com/w3c/webcomponents/blob/gh-pages/proposals/Slots-Proposal.md) e c'è l'attributo speciale `is` però ci sono alcune differenze sostanziali:
115+
Come avrete notato i componenti di Vue.js sono molto simili ai **Componenti Personalizzati** che fanno parte della [Specifica sui Componenti Web](http://www.w3.org/wiki/WebComponents/). Difatti, la sintassi dei componenti Vue.js è fatta ad immagine e somiglianza di quelle specifiche. Per esempio implementano la così detta [Slot API](https://github.com/w3c/webcomponents/blob/gh-pages/proposals/Slots-Proposal.md) e c'è l'attributo speciale `is` però ci sono alcune differenze sostanziali:
116116

117117
1. La specifica dei Componenti web è ancora un lavoro non finito, e non tutti i browser implementano tale specifica. Vue.js invece non ha bisogno di nessun supporto per far funzionare i Componenti, e vengono ben interpretati da tutti i browser (IE9 e maggiori versioni). Quando serve, i Componenti Vue.js possono essere anche incapsulati dentro ad elementi nativi.
118118

0 commit comments

Comments
 (0)