Не срабатывает условие || или. Что я делаю не правильно?

Question

[salco2012]

created() {
    this.getUserRecipes();
    window.addEventListener('resize', this.countRanks);
  },
  computed: {
    ranks() {
      const ranks = [];
      this.selectedRecipes.forEach((item, index) => {
        const rank = Math.floor(index / (this.countRanks() || 4));
        if (!ranks[rank]) {
          ranks[rank] = [];
        }
        ranks[rank].push(item);
      });
      return ranks;
    },
  },
  methods: {
    countRanks(e) {
      const screenWidth = e.target.innerWidth;
      if (screenWidth >= 992 && screenWidth < 1200) {
        return 3;
      }
      if (screenWidth >= 768 && screenWidth < 992) {
        return 2;
      }
      if (screenWidth > 0 && screenWidth < 768) {
        return 1;
      }
      return 4;
    },

Выдает ошибку "Error in render: "TypeError: Cannot read properties of undefined (reading 'target')"

Помогите мне разобраться, нужно в const rank = Math.floor(index / ****)
*** по умолчанию должно быть 4, но если срабатывает функция countRanks должно быть число которая она вернет.

Answer 1

[Алексей Дубровин]

1) Ошибка не в "||"
2) Так же этот блок абсолютно не нужен, тк как в "countRanks()" не возвращает ложное значение.
3) Ошибка прямым текстом описана "TypeError: Cannot read properties of undefined (reading 'target')" , всё что нужно это открыть переводчик.

Answer 2

[Сергей delphinpro]

Посмотрите внимательно на вызов метода.

const rank = Math.floor(index / (this.countRanks() || 4));

А теперь на его определение

countRanks(e) {
}

Не кажется ли вам, что вы забыли про параметр?