Проблема с Vue.js: не отображает данные

Question

Проблема с Vue.js: не отображает данные

Я учу Vue.js фреймворк, и я делаю некоторые попытки, чтобы справиться с этим фреймворком JavaScript.

Мой пример очень прост, но я не побоюсь показать data {} в соответствии с .html а также .js файлы.

Это мой файл.html:

<!DOCTYPE html>
<html>
<head>
    <title>Test de Vue.js</title>
    <script src="test.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
</head>
<body>

    <div id='test'>
        <p>{{ texte }}</p>
    </div>

</body>
</html>

И мой файл.js находится в том же каталоге:

var vm = new Vue ({
    el : '#test',
    data : {
        texte : 'Ceci est un premier test en Vue.js'
    }
});

Но я не знаю, почему мой браузер отображает это:

огромное спасибо

0

javascript vue.js vue.js-directives

Источник

user6067364 09 июл '18 в 08:31

1 ответ

Решение

Другие вопросы по тегам javascript vue.js vue.js-directives

user2418224 09 июл '18 в 08:34 2018-07-09 08:34 · Accepted Answer · 2018-07-09 08:34

Ваши сценарии в неправильном порядке. Сначала вы должны включить Vue.js, а затем ваш скрипт, потому что ваш скрипт ссылается Vue объект, который определен в vue.js,

Кроме того, в то время как vue.js может быть включен в <head>ваше определение модели Vue должно войти в <body> тег, после целевого элемента, иначе он не будет работать.

<head>
    ...
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
</head>
<body>
    <div id="test">...</div>
    <script src="test.js"></script>
</body>