Skip to main content
Pergunta fechada como "Não é adequada para este site" por Syzoth
adicionou 38 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Estou criando um projeto básico com Vue 3 e estou tentando renderizar uma mensagem dinâmica usando o recurso de interpolação {{ message }}{{ message }}. O problema é que, em vez de exibir o valor da variável messagemessage, ele exibe o texto literal {{ message }}{{ message }} na página.

Aqui está meu código:

HTML:

Vue Test

{{ message }}

const SelfServiceMachine = { data() { return { message: "Hello World" }; } };
    Vue.createApp(SelfServiceMachine).mount('#app');
</script>
texto em negrito Problema:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Vue Test</title>
</head>
<body>
    <main id="app">
        <h4>{{ message }}</h4>
    </main>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <script>
        const SelfServiceMachine = {
            data() {
                return {
                    message: "Hello World"
                };
            }
        };

        Vue.createApp(SelfServiceMachine).mount('#app');
    </script>
</body>
</html>
Quando carrego a página, o texto {{ message }} aparece literalmente no lugar do valor esperado "Hello World".

texto em negrito

O que eu já tenteiProblema:

Verifiquei que o Vue 3 está sendo carregado corretamente no navegador. Testei seQuando carrego a página, o JavaScript está sem erros. Não há mensagens de errotexto {{ message }} aparece literalmente no console. Usei o recurso de limpeza de cachelugar do navegadorvalor esperado (Ctrl + F5). Recriei um projeto básico para testar, mas o problema persiste"Hello World".

O que eu já tentei:

  • Verifiquei que o Vue 3 está sendo carregado corretamente no navegador.
  • Testei se o JavaScript está sem erros. Não há mensagens de erro no console.
  • Usei o recurso de limpeza de cache do navegador (Ctrl + F5).
  • Recriei um projeto básico para testar, mas o problema persiste.

Estou criando um projeto básico com Vue 3 e estou tentando renderizar uma mensagem dinâmica usando o recurso de interpolação {{ message }}. O problema é que, em vez de exibir o valor da variável message, ele exibe o texto literal {{ message }} na página.

Aqui está meu código:

HTML:

Vue Test

{{ message }}

const SelfServiceMachine = { data() { return { message: "Hello World" }; } };
    Vue.createApp(SelfServiceMachine).mount('#app');
</script>
texto em negrito Problema: Quando carrego a página, o texto {{ message }} aparece literalmente no lugar do valor esperado "Hello World".

O que eu já tentei:

Verifiquei que o Vue 3 está sendo carregado corretamente no navegador. Testei se o JavaScript está sem erros. Não há mensagens de erro no console. Usei o recurso de limpeza de cache do navegador (Ctrl + F5). Recriei um projeto básico para testar, mas o problema persiste.

Estou criando um projeto básico com Vue 3 e estou tentando renderizar uma mensagem dinâmica usando o recurso de interpolação {{ message }}. O problema é que, em vez de exibir o valor da variável message, ele exibe o texto literal {{ message }} na página.

Aqui está meu código:

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Vue Test</title>
</head>
<body>
    <main id="app">
        <h4>{{ message }}</h4>
    </main>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <script>
        const SelfServiceMachine = {
            data() {
                return {
                    message: "Hello World"
                };
            }
        };

        Vue.createApp(SelfServiceMachine).mount('#app');
    </script>
</body>
</html>

texto em negrito

Problema:

Quando carrego a página, o texto {{ message }} aparece literalmente no lugar do valor esperado "Hello World".

O que eu já tentei:

  • Verifiquei que o Vue 3 está sendo carregado corretamente no navegador.
  • Testei se o JavaScript está sem erros. Não há mensagens de erro no console.
  • Usei o recurso de limpeza de cache do navegador (Ctrl + F5).
  • Recriei um projeto básico para testar, mas o problema persiste.
Fonte Link

Por que o {{ message }} não é renderizado corretamente no Vue 3?

Estou criando um projeto básico com Vue 3 e estou tentando renderizar uma mensagem dinâmica usando o recurso de interpolação {{ message }}. O problema é que, em vez de exibir o valor da variável message, ele exibe o texto literal {{ message }} na página.

Aqui está meu código:

HTML:

Vue Test

{{ message }}

const SelfServiceMachine = { data() { return { message: "Hello World" }; } };
    Vue.createApp(SelfServiceMachine).mount('#app');
</script>
texto em negrito Problema: Quando carrego a página, o texto {{ message }} aparece literalmente no lugar do valor esperado "Hello World".

O que eu já tentei:

Verifiquei que o Vue 3 está sendo carregado corretamente no navegador. Testei se o JavaScript está sem erros. Não há mensagens de erro no console. Usei o recurso de limpeza de cache do navegador (Ctrl + F5). Recriei um projeto básico para testar, mas o problema persiste.