IT . VUEJS . ORG {}

Passa al contenuto Vue.js Ricerca Ctrl K Navigazione principale Documentazione API Playground Ecosistema About Sponsor Partners github twitter discord Pagina non trovata Hai trovato un link morto : /404.html Grazie per farcelo sapere per aiutarci a risolvere quanto prima. 404 has loaded Preferenze API Options Composition ? Lo stile API predefinito ora è Composition API. Alcune pagine contengono contenuti diversi in base allo stile API scelto. Usa questo interruttore per alternare gli stili API. Scopri di piùHo capito Navigazione secondaria Guida introduttiva Panoramica Avvio rapido Gli Elementi Essenziali Creare un'applicazione La Sintassi del Template Le basi della Reattività Le Computed Properties Binding per Classi e Stili CSS Rendering Condizionale Il Rendering delle Liste La Gestione degli Eventi Binding per gli Input dei Form Gli Hook del Ciclo di Vita I Watcher I Ref del Template Nozioni base sui Componenti I Componenti nel dettaglio La Registrazione Le Props Gli Eventi Il v-model nei componenti Gli Attributi Trasferibili (Fallthrough) Gli Slot Provide / inject I Componenti Asincroni Il Riutilizzo del Codice I Composables Le Direttive Personalizzate I Plugin I Componenti nativi Transition TransitionGroup KeepAlive Teleport Suspense Scalabilità per progetti complessi I Componenti Single-File Gli Strumenti per lo sviluppo Il Routing La Gestione dello Stato I Test nel dettaglio Il Rendering Server-Side (SSR) Best Practices Rilascio in Produzione Performance Accessibilità Web Sicurezza TypeScript Panoramica TS con Composition API TS con Options API Argomenti Extra Modi di utilizzare Vue FAQ sulla Composition API La Reattività in dettaglio Il Meccanismo di Rendering Le Render Function e JSX Vue e i Web Components Tecniche di Animazione IN QUESTA PAGINA Table of Contents for current page Cos'è Vue? Il Framework Progressivo Componenti Single-File Stili delle API Hai ancora domande? Scegli il tuo percorso di apprendimento​ SPONSOR Il tuo logo Panoramica ​ Stai leggendo la documentazione per Vue 3! Il supporto a Vue 2 terminerà il 31 Dicembre 2023. Per saperne di più vai su Vue 2 Extended LTS. La documentazione di Vue 2 è stata spostata su v2.vuejs.org. Stai aggiornando da Vue 2? Dai un'occhiata alla Guida alla Migrazione . Impara Vue con i tutorial video su VueMastery.com Cos'è Vue? ​ Vue (pronunciato /vjuː/, come view in inglese) è un framework JavaScript per la costruzione di interfacce utente. Si basa su standard HTML, CSS e JavaScript e fornisce un modello di programmazione dichiarativo e basato su componenti che ti aiuta a sviluppare in modo efficiente interfacce utente, siano esse semplici o complesse. Questo è un piccolo esempio: js import { createApp, ref } from 'vue' createApp({ setup() { return { count: ref(0) } } }).mount('#app') template Risultato Il conteggio è: 0 L'esempio precedente dimostra le due caratteristiche fondamentali di Vue: Rendering Dichiarativo: Vue estende l'HTML standard con una sintassi di template che ci permette di descrivere in modo dichiarativo l'output HTML basato sullo stato JavaScript. Reattività: Vue traccia automaticamente i cambiamenti dello stato JavaScript e aggiorna in modo efficiente il DOM quando avvengono modifiche. Potresti già avere delle domande, non preoccuparti. Copriremo ogni piccolo dettaglio nel resto della documentazione. Per ora, ti preghiamo di continuare a leggere per avere una comprensione di alto livello di ciò che Vue offre. Prerequisiti Il resto della documentazione presume una conoscenza di base di HTML, CSS e JavaScript. Se sei completamente nuovo allo sviluppo frontend, potrebbe non essere la migliore idea tuffarti direttamente nell'uso di un framework Javascript - impara le basi e poi riprendi! Puoi verificare il tuo livello di conoscenza con questa panoramica di JavaScript. L'esperienza precedente con altri framework aiuta, ma non è necessaria. Il Framework Progressivo ​ Vue è un framework e un ecosistema che copre la maggior parte delle caratteristiche necessarie allo sviluppo frontend. Ma il web è estremamente vario - le cose che costruiamo sul web possono essere estremamente differenti nella forma e nella grandezza. Pensando a ciò, Vue è stato progettato per essere flessibile e favorirne l'uso in modo incrementale. A seconda del tuo caso d'uso, Vue può essere utilizzato in modi diversi: Migliorare l'HTML statico senza l'uso della compilazione Incorporare Web Components su qualsiasi pagina Applicazioni Single-Page (SPA) Fullstack / Rendering Server-Side (SSR) Jamstack / Generazione di Siti Statici (SSG) per usi su desktop, mobile, WebGL e perfino al terminale Se questi concetti sembrano difficili non preoccuparti! Il tutorial e la guida richiedono conoscenze di HTML e JavaScript di base e dovresti riuscire a seguire tutto senza essere un esperto. Se sei uno sviluppatore esperto interessato a come integrare al meglio Vue nel tuo stack tecnologico, o sei curioso di sapere cosa significano questi termini, ne discutiamo in modo più dettagliato in Modi di utilizzare Vue. Indipendentemente dalla sua flessibilità, la conoscenza di base su come funziona Vue rimane la stessa in tutti casi d'uso visti qui sopra. Anche se ora sei solo un principiante, le conoscenze acquisite lungo il cammino rimarranno utili mentre cresci e affronti obiettivi sempre più ambiziosi. Se sei un veterano, puoi scegliere il modo più congeniale per sfruttare Vue in base ai problemi che stai cercando di risolvere, mantenendo la stessa produttività. Questo è il motivo per cui chiamiamo Vue "Il Framework Progressivo": è un framework che può crescere con te e adattarsi alle tue esigenze. Componenti Single-File ​ Nei progetti Vue che sfruttano gli strumenti di compilazione, creiamo componenti Vue utilizzando un formato di file simile a HTML chiamato Single-File Component (Componente in un singolo file, anche noto come file *.vue , abbreviato in SFC). Un file SFC, come suggerisce il nome, incorpora in un singolo file la logica (JavaScript), il template (HTML) e lo stile (CSS) del componente. Ecco l'esempio precedente, riscritto in formato SFC: vue L'SFC è una caratteristica distintiva di Vue ed è il modo consigliato per la creazione di componenti Vue se il tuo progetto richiede l'uso e la configurazione della compilazione. Nella sezione dedicata puoi saperne di più su come e perché usare SFC. Al momento è sufficiente sapere che Vue si occuperà di tutta la configurazione degli strumenti di compilazione per te. Stili delle API ​ I componenti Vue possono essere scritti in due diversi stili di API: Options API e Composition API. Options API ​ Con l'Options API definiamo la logica di un componente utilizzando un oggetto contenente opzioni come data, methods, and mounted. Le proprietà definite dalle opzioni vengono esposte all'interno delle funzioni su this, che fa riferimento all'istanza del componente: vue Prova nel Playground Composition API ​ Nella Composition API definiamo la logica di un componente importando le funzioni dell'API. Negli SFC, di solito, la Composition API è utilizzata con Prova nel Playground Quale scegliere? ​ Entrambi gli stili di API sono completamente in grado di coprire i casi d'uso più comuni. Si tratta di interfacce diverse alimentate dallo stesso identico sistema. In effetti l'Options API è implementata al di sopra della Composition API! I concetti fondamentali e la conoscenza riguardo Vue sono condivisi dai due stili. L'Options API è incentrata sul concetto di "component instance" ('istanza di componente', this come visto nell'esempio), che tipicamente si allinea meglio con un modello mentale basato sulle Classi per gli utenti provenienti da linguaggi OOP. È anche più accessibile ai principianti, nascondendo i dettagli della reattività e imponendo un'organizzazione del codice tramite gruppi di opzioni. La Composition API, invece, si concentra sulla dichiarazione di variabili di stato reattive direttamente nell'ambito di una funzione e, per gestire la complessità, sulla composizione dello stato da più funzioni insieme. È un modo di scrivere codice più libero e richiede una comprensione di come funziona la reattività in Vue per essere utilizzata in modo efficace. In cambio la sua flessibilità consente strutture per l'organizzazione e il riutilizzo della logica più potenti. Puoi saperne di più sul confronto tra i due stili e sui potenziali vantaggi della Composition API nelle FAQ sulla Composition API. Se sei nuovo in Vue, in linea di massima, ecco la nostra raccomandazione: Per scopi di apprendimento scegli lo stile che ti sembra più facile da capire. Ancora una volta, la maggior parte dei concetti chiave sono condivisi tra i due stili. Puoi sempre imparare l'altro stile in seguito. Per l'uso in produzione: Scegli l'Options API se non stai utilizzando strumenti di build, o se prevedi di utilizzare Vue principalmente in scenari di bassa complessità, ad esempio per un miglioramento progressivo. Scegli la Composition API + Componenti Single-File se prevedi di costruire applicazioni complete con Vue. Non devi impegnarti a utilizzare un solo stile durante la fase di apprendimento. Il resto della documentazione fornirà esempi di codice in entrambi gli stili dove applicabile, e potrai passare da uno all'altro in qualsiasi momento utilizzando il selettore di preferenza API, presente nella parte superiore della barra laterale sinistra. Hai ancora domande? ​ Consulta le nostre FAQ. Scegli il tuo percorso di apprendimento​ ​ Ogni sviluppatore ha uno stile di apprendimento diverso. Sentiti libero di scegliere un percorso di apprendimento che si adatti alle tue preferenze - anche se ti consigliamo di esaminare tutto il contenuto, se possibile! Prova il Tutorial Per coloro che preferiscono apprendere sporcandosi le mani. Leggi la Guida La guida ti mostrerà in dettaglio ogni aspetto del framework. Guarda gli Esempi Esplora gli esempi di funzionalità base e casi d'uso comuni. Modifica questa pagina su GitHub Panoramica has loaded