Блог

Главная - Вопросы по программированию - Как передать это в Vue.js ?

Как передать это в Vue.js ?

#javascript #vue.js #vue-component

#javascript #vue.js #vue-компонент

Вопрос:

Текущий код

 <header :class="{ 'active': scrollY > 900 }">
  <span>header</span>
</header>
 
 export default {
  data() {
    return {
      scrollY: 0
    }
  },
  mounted() {
    window.addEventListener('scroll', this.handleScroll)
  },
  methods: {
    handleScroll() {
      this.scrollY = window.scrollY
    }
  }
}

Я хотел бы передать <header> себя, как

 <header :class="{ 'active': this }">

В Vue.js — как я могу это сделать?
Должен ли я использовать ref ?

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

1. Что вы хотите сделать с этим в дочернем компоненте? На мой взгляд, это не очень хорошая практика делать такие вещи.

2. Просто используйте вычисляемое свойство.

3. является ли заголовок элементом html или компонентом Vue? Если это компонент, вы можете задать в нем имя класса..