Блог

Главная - Вопросы по программированию - Начиная с Vue.js и ничего не отображается

Начиная с Vue.js и ничего не отображается

#javascript #vue.js #vuejs2

Вопрос:

Я пытаюсь начать использовать vue.js и возникли проблемы с его настройкой. В моем пакете.json я установил последнюю версию "vue": "^2.6.14", , и в моей main.js папке я включил вот так

 import Vue from "vue";
var app = new Vue({
    el: '#app',
    data: {
      message: 'Hello Vue!'
    }
  })

и в свой html-файл я добавил это:

 <div id="app">
  {{ message }}
</div>

когда webpack компилируется, он создает это main.js файл, но {{ сообщение }} не изменен на Hello Vue!. Что я здесь делаю не так, что это не работает?

Также в инструментах разработки не отображается ошибка.

Комментарии:

1. возможно, вам захочется переместить свойство данных и шаблон= {{message}} в App.vue вместо main.js и index.html .

2. Проверьте консоль инструментов разработки вашего браузера на наличие ошибок

3. @Фил спасибо, но никакой ошибки там нет

4. Вам придется пройти все шаги, которые вы предпринимаете… как вы начали проект? Вы используете Vue CLI? Какие команды вы используете для запуска или создания своего проекта? Какой адрес вы открываете в своем браузере?

5. Как вы можете видеть здесь , ваш код работает просто отлично

Ответ №1:

Попробуй

 import Vue from "vue";
var app = new Vue({
    el: '#app',
    data () {
      return {
        message: "Hello Vue!"
      }
    }
  }).$mount('#app');

Это решило бы вашу проблему

Комментарии:

1. где бы я это добавил? до конца файла?

2. Я отредактировал свой ответ, вам нужно заменить объект данных для работы

Ответ №2:

 import Vue from "vue";

new Vue({
   data() {
       return {
          message: 'Hello Vue!',
       };
   },
}).$mount('#app');

Комментарии:

1. к сожалению, по-прежнему ничего не показывает, я также добавил window.Vue = Vue; , но ничего не отображается

2. Вы уверены, что включаете файл js в свой html..

3. да, я проверил исходный код и main.js загружено — это тот контент, который я опубликовал в вопросе.

4. Да, братан, ты не включил свой js-файл в html. работает нормально. codepen.io/pen/?editors=1111

Метки: