0xD34F

$('.slider-nav')
  .slick({
    slidesToShow: 5,
    slidesToScroll: 1,
    dots: true,
    centerMode: true,
    focusOnSelect: true,
    variableWidth: true,
  })
  .on('click', '.slick-slide', function() {
    $('.slider-for').slick('slickGoTo', this.dataset.index);
  })
  .find('.item-nav')
  .attr('data-index', i => i);

if (!this.map) {
  this.map = DG.map(...);
  this.marker = DG.marker(...);
} else {
  this.map.panTo(...)
  this.marker.setLatLng(...);
}

let list = null;

$('.connectedSortable').sortable({
  connectWith: '.connectedSortable',
  over(e, ui) {
    list = this;
  },
  stop(e, ui) {
    if (list === this) {
      e.preventDefault();
    }
  },
  receive(e, ui) {
    $(this).append(ui.item);
  },
});

[...new Set(array.flatMap(n => n.columns).map(n => n.type).filter(n => !defaultTypes.includes(n)))]

const group = (arr, key) =>
  arr.reduce((acc, n) => {
    const k = n[key];
    (acc[k] = acc[k] || []).push(n);
    return acc;
  }, {});


const result = Object.values(group(array, 'prop'));

function group(data, key, val = n => n) {
  const getKey = key instanceof Function ? key : n => n[key];
  const getVal = val instanceof Function ? val : n => n[val];
  const grouped = {};

  for (const n of data) {
    (grouped[getKey(n)] ??= []).push(getVal(n));
  }

  return grouped;
}

const groupedBySign = group([ 0, 1, 2, 3, -10, -20, -30, 0 ], Math.sign);

const groupedByParity = group(Array(10).keys(), n => [ 'чётные', 'нечётные' ][n & 1]);

const chars = group(
  'ABC123?!+',
  n =>
    n.toLowerCase() !== n.toUpperCase() ? 'буква' :
    Number.isInteger(+n)                ? 'цифра' :
                                          'другое'
);

<input name="xxx" value="69">
<input name="xxx" value="187">
<input name="xxx" value="666">
<input name="yyy" value="0">

const values = group(document.querySelectorAll('input'), 'name', 'value');

const result = Object.values(Object.groupBy(array, n => n.prop));

Через обертку <div class="container-avatar"><Avatar/></div> - в этом варианте лишний html елемент

options: {
  scales: {
    xAxes: [ {
      ticks: {
        display: false
      }
    } ],
    yAxes: [ {
      ticks: {
        display: false
      }
    } ]
  }
}

<div v-for="item in flightsData">
  <div>Price: {{ item.price }}</div>
  <div v-for="f in item.flights">
    <div>Departure: {{ f.cities.departureCity }}, {{ f.departureTime }}</div>
    <div>Arrival: {{ f.cities.arrivalCity }}, {{ f.arrivalTime }}</div>
  </div>
</div>

this.flightsData = response.data.filter(n => val.includes(n.flights[0].airline.code));

пишет ошибку что свойства id нету

isShow() {
  return ((this.getProject() || {}).creator || {}).id === this.user.id;
},

как в другом компоненте дождаться пока метод fetch() положит данные с store?

methods: {
  select(airline) {
    const index = this.selected.indexOf(airline);
    if (index !== -1) {
      this.selected.splice(index, 1);
    } else {
      this.selected.push(airline);
    }
  },
},

computed: {
  checkedAll: {
    get() {
      return this.airlines.every(n => this.selected.includes(n.name));
    },
    set(val) {
      this.selected = val ? this.airlines.map(n => n.name) : [];
    },
  },
},

AJAX запрос <...> нужен watch?

что лучше использовать

Если вам не сложно, можно для чайников и более наглядно ?

data: () => ({
  items: [
    { active: false, text: '...' },
    { active: false, text: '...' },
    ...
  ],
}),

<div
  v-for="n in items"
  v-text="n.text"
  :class="[ { active: n.active }, 'toggle' ]"
  @click="n.active = !n.active"
></div>

а как сделать чтобы не городить кучу даныx в data?

data: () => ({
  itemsCount: 5,
  active: [],
}),
methods: {
  toggle(item) {
    const i = this.active.indexOf(item);
    if (i === -1) {
      this.active.push(item);
    } else {
      this.active.splice(i, 1);
    }
  },
},

<div
  v-for="i in itemsCount"
  v-text="`Item ${i}`"
  :class="[ { active: active.includes(i) }, 'toggle' ]"
  @click="toggle(i)"
></div>

<div class="block">hello, world!!</div>
<div class="block">fuck the world</div>
<div class="block">fuck everything</div>
<button>click me</button>

.block {
  display: none;
}

const $btn = $('button').click(function() {
  $btn.hide();

  $('.block').get().reduceRight((onComplete, el) => {
    return () => $(el).fadeIn(300).delay(1000).fadeOut(300, onComplete);
  }, () => $btn.show())();
});

Проблема в том, что код <...> не удаляет класс

выполняются одновременно

console.log('щас будем создавать промис');
new Promise(r => {
  console.log('создаём промис');
  setTimeout(() => {
    console.log('так, сейчас дёрнем резолв');
    r();
    console.log('резолв дёрнули');
  });
}).then(() => console.log('зарезолвились, наконец-то'));
console.log('промис создан');

Чето я вообще ничего найти не могу.