Событие, смонтированное Vue, не является "рабочим"

Я пытаюсь создать страницу, где переменная должна быть установлена ??сразу после загрузки страницы. Я поместил свой метод и попытался отлаживать его повторно без каких-либо результатов, тогда я попытался просто напечатать строку на консоли, mountedи ничего не произошло ... Я не уверен, что я что-то упустил.

Я подниму свой проект usnig Vue CLI и на данный момент, в следующем коде, мне нужно вставить изменения в HelloWorld.vueшаблон из шаблона

Я также добавил кнопку в качестве чека,

      <button onclick="foo">foo</button>

раздел сценария страницы выглядит следующим образом:

  <script>
export default {
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  },
  methods: {
    mounted: function() {
      console.log("Mounted!")
    },
    foo: function() {
      console.log("button")
    }
  }
}
</script>

ожидаемое поведение - «установить»! на консоли при сохранении и обновлении, и «кнопку» всякий раз, когда я нажимаю кнопку. Я ничего не вижу, когда отображается страница, и появляется только «кнопка», когда я нажимаю кнопку. Является ли mountedнеправильная функция использовать здесь или я упускаю что - то другое?

javascript,vue.js,vuejs2,

0

Ответов: 1


2 принят

Ах. Это простая и распространенная ошибка, которую люди совершают. Вот как вы должны на самом деле писать.

 <script>
export default {
el: '#app',
data: {
message: 'Hello Vue.js!'
},
methods: {
foo: function() {
  console.log("button")
 }
},
 mounted: function() {
  console.log("Mounted!")
 },
}
</script>

должен быть на одном уровне с методами, данными или рассчитан. Не внутри методов.

Вот и все, теперь он должен работать.

Я надеюсь, что это помогает.

javascript, vue.js, vuejs2,
Похожие вопросы