# vue: URL: https://generaltranslation.com/it/docs/vue/reference/components/num.mdx --- title: "" description: Formatta un numero in base all'impostazione regionale attiva. Riferimento API del componente . --- Il componente `` formatta un `value` numerico obbligatorio con `Intl.NumberFormat`. Usalo da solo o come variabile a runtime all'interno di [``](/docs/vue/reference/components/t). ## Panoramica [#overview] Associa il numero a `value` e mantieni il componente autochiudente: ```vue ``` La formattazione avviene localmente. Il valore numerico non viene tradotto né incluso nel testo sorgente per la traduzione. ## Come funziona [#how-it-works] * Un numero viene passato direttamente a `Intl.NumberFormat`. * Una stringa deve rappresentare un numero completo. Le stringhe contenenti solo spazi e `null` renderizzano un valore vuoto; una stringa numerica non valida viene renderizzata senza modifiche. * Il contenuto figlio dello slot del formattatore viene ignorato. Fornisci sempre `value` e usa un tag autochiudente. * Il componente non aggiunge alcun wrapper HTML. ### Risoluzione dell'impostazione regionale Quando l'impostazione regionale attiva è quella predefinita configurata, la formattazione usa solo quest'ultima e ignora `locales`. Per qualsiasi altra impostazione regionale attiva, un formattatore autonomo prova prima i `locales` espliciti, poi l'impostazione regionale attiva e infine quella predefinita. Le impostazioni regionali duplicate vengono rimosse senza modificarne l'ordine. All'interno di [``](/docs/vue/reference/components/t), la traduzione rich controlla la formattazione: il contenuto fallback sorgente usa l'impostazione regionale predefinita, mentre il contenuto tradotto prova l'impostazione regionale attiva e poi quella predefinita. In tal caso, una prop `locales` esplicita viene ignorata. ## Props [#props] | Prop | Descrizione | Tipo | Facoltativo | Predefinito | | --------------------- | ------------------------------------------------------ | -------------------------- | ----------- | -------------------------------------------------- | | [`value`](#value) | Valore numerico da formattare. | `number \| string \| null` | No | — | | [`options`](#options) | Opzioni passate a `Intl.NumberFormat`. | `Intl.NumberFormatOptions` | Sì | `{}` | | [`locales`](#locales) | Impostazioni regionali preferite per la formattazione. | `string[]` | Sì | Ordine di risoluzione delle impostazioni regionali | ### `value` **Tipo** `number | string | null` · **Obbligatorio** Il valore numerico completo da formattare. Le stringhe numeriche vengono convertite con `Number()` prima della formattazione. Valori come `"12 items"` o `"1,234.5"` non vengono analizzati parzialmente e vengono renderizzati senza modifiche. ```vue ``` ### `options` **Tipo** `Intl.NumberFormatOptions` · **Facoltativo** · **Predefinito** `{}` Opzioni passate all'implementazione di `Intl.NumberFormat` del runtime JavaScript. Le opzioni più comuni includono: | Opzione | Descrizione | Tipo | Facoltativo | Predefinito | | -------------------------- | ------------------------------------------------------------------------------- | ------------------------------------------------------------- | ----------- | ------------------------------------------ | | `localeMatcher` | Algoritmo di corrispondenza dell'impostazione regionale. | `'lookup' \| 'best fit'` | Sì | `'best fit'` | | `numberingSystem` | Sistema di numerazione, ad esempio `latn` o `arab`. | `string` | Sì | Dipendente dall'impostazione regionale | | `style` | Formattazione decimale, percentuale, di valuta o di unità. | `'decimal' \| 'percent' \| 'currency' \| 'unit'` | Sì | `'decimal'` | | `currency` | Codice ISO 4217 richiesto dallo stile di valuta. | `string` | Sì | — | | `currencyDisplay` | Modalità di visualizzazione della valuta. | `'code' \| 'symbol' \| 'narrowSymbol' \| 'name'` | Sì | `'symbol'` | | `unit` | Identificatore di unità richiesto dallo stile di unità, ad esempio `kilometer`. | `string` | Sì | — | | `unitDisplay` | Larghezza dell'etichetta dell'unità. | `'long' \| 'short' \| 'narrow'` | Sì | `'short'` | | `minimumIntegerDigits` | Numero minimo di cifre intere. | `number` | Sì | `1` | | `minimumFractionDigits` | Numero minimo di cifre frazionarie. | `number` | Sì | Dipendente dallo stile | | `maximumFractionDigits` | Numero massimo di cifre frazionarie. | `number` | Sì | Dipendente dallo stile | | `minimumSignificantDigits` | Numero minimo di cifre significative. | `number` | Sì | `1` | | `maximumSignificantDigits` | Numero massimo di cifre significative. | `number` | Sì | `21` | | `useGrouping` | Quando visualizzare i separatori di raggruppamento. | `boolean \| string` | Sì | Dipendente dalla notazione | | `notation` | Notazione numerica. | `'standard' \| 'scientific' \| 'engineering' \| 'compact'` | Sì | `'standard'` | | `compactDisplay` | Larghezza dell'etichetta della notazione compatta. | `'short' \| 'long'` | Sì | `'short'` | | `signDisplay` | Quando visualizzare un segno. | `'auto' \| 'always' \| 'exceptZero' \| 'negative' \| 'never'` | Sì | `'auto'` | | `roundingMode` | Direzione usata per l'arrotondamento. | `string` | Sì | Dipendente dal runtime | I valori predefiniti per le cifre frazionarie dipendono dallo `style` selezionato. I campi e i valori supportati possono inoltre variare in base al runtime JavaScript. Consulta le [opzioni di `Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#options) per l'insieme completo definito dal runtime. ### `locales` **Tipo** `string[]` · **Facoltativo** · **Predefinito** Ordine di risoluzione delle impostazioni regionali Codici locale BCP 47 preferiti per la formattazione autonoma. Vengono utilizzati prima dell'impostazione regionale attiva e di quella predefinita solo se l'impostazione regionale attiva non corrisponde a quella predefinita configurata. ```vue ``` ## Esempi [#examples] ```vue title="InventorySummary.vue" ```