Я пытаюсь создать простое приложение в vue, и я получаю сообщение об ошибке. Моя функция onScroll ведет себя так, как ожидалось, но моя функция sayHello возвращает ошибку, когда я нажимаю компонент кнопки
Свойство или метод "sayHello" не определен в экземпляре, но упоминается во время рендеринга. Обязательно объявляйте свойства реактивных данных в опции данных. (найдено в компоненте)
Vue.component('test-item', {
template: '<div><button v-on:click="sayHello()">Hello</button></div>'
});
var app = new Vue({
el: '#app',
data: {
header: {
brightness: 100
}
},
methods: {
sayHello: function() {
console.log('Hello');
},
onScroll: function () {
this.header.brightness = (100 - this.$el.scrollTop / 8);
}
}
});
Я чувствую, что ответ действительно очевиден, но я пробовал искать и ничего не придумал. Любая помощь будет оценена по достоинству.
Благодарю.