Skip to content
This repository was archived by the owner on Apr 29, 2025. It is now read-only.
This repository was archived by the owner on Apr 29, 2025. It is now read-only.

Add Intl.DisplayNames#281

Description

@Kheuval

馃啋 Your use case

Currently in Nuxt, using new Intl.DisplayNames("en", { type: "region" }) results in different outputs on the server and on the client as pointed out in this issue : nuxt/nuxt#28644

This causes hydration mismatch errors on the client.

馃啎 The solution you'd like

A component that takes a locale prop, and an options prop, and displays the correct text based on those props.

In order to account for all possible use cases, I believe the component's props should comply with the Intl.DisplayNames spec.

The component should render the same content on the server and on the client.

馃攳 Alternatives you've considered

Maybe a composable (?) or utility function that serves the same purpose is enough, the key is to have something that works both on the server and the client to avoid hydration mismatch errors.

鈩癸笍 Additional info

I'm available to help with this feature !
However, I'm still very new to the Vue and Nuxt ecosystem (and in programing in general) so I will definitively need guidance if I must develop this feature.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions