0xD34F

Так?

Свойство lines в настройках сетки, отдельно для каждой из осей.

Правильно конечно в PHP.

Дело в том, что в JS побитовые операции выполняются над 32-битными целыми числами со знаком, для которых максимальное положительное значение 2147483647. Что меньше, чем 2851871266. Соответственно, получается переполнение.

А если так?

Link - аналогично прочим, Route - первым, до общего.

Так, а в чём принципиальная разница между элементами li? - что-то я таковой не улавливаю. Сделайте массив, содержащий их описания, классы и количество span'ов будут задаваться отдельными свойствами. Дальше обрабатывайте этот массив через v-for. Также добавьте в компонент свойство, которое будет содержать в себе индекс активного элемента, и тогда назначение класса active станет задачей тривиальной:

data: () => ({
  active: null,
  items: [
    { text:  'hello, world!!', numSpans: 3, classes: [] },
    { text:  'fuck the world', numSpans: 6, classes: [ 'yyy' ] },
    { text: 'fuck everything', numSpans: 0, classes: [ 'zzz' ] },
  ],
}),

<ul>
  <li v-for="(n, i) in items" :class="{ active: active === i }">
    <a :class="[ 'xxx', ...n.classes ]" @click="active = i">
      {{ n.text }}
      <span v-for="s in n.numSpans"></span>
    </a>
  </li>
</ul>

.active {
  background: red;
}

computed: {
  reversedItems() {
    return [...this.items].reverse();
  },
},

v-for="n in reversedItems"

Метод setState - асинхронный. Хотите какие-то действия выполнять после изменения стейта - выполняйте их в колбеке:

this.setState(newState, () => {
  // вот здесь
})

Наверное, теряется контекст.

Попробуйте
.catch(this.handleError)
заменить на
.catch(err => this.handleError(err))

Ну как бы так.

Нехорошее решение - хранить в корзине сумму. Из-за этого вы при удалении элемента не можете правильно определить, сколько надо вычесть. Лучше так - хранить не сумму, а сами элементы. Когда сумма понадобится - посчитать её. Например.

const result = elements.filter(n => !used.some(m => m.id === n.id));

или

const result = elements.filter(((ids, n) => !ids.includes(n.id)).bind(null, used.map(n => n.id)));

или

const result = elements.filter(function(n) {
  return !this.has(n.id);
}, new Set(used.map(n => n.id)));

или

const result = Object.values(used.reduce(
  (acc, n) => (delete acc[n.id], acc),
  elements.reduce((acc, n) => (acc[n.id] = n, acc), {})
));

или

const result = [...used.reduce(
  (acc, n) => (acc.delete(n.id), acc),
  new Map(elements.map(n => [ n.id, n ]))
).values()];

Например:

$.getJSON('https://api.cdnjs.com/libraries/jquery', function(data) {
  $('body').append(`<pre>${JSON.stringify(data, null, 2)}</pre>`);
});

Или, если вам непременно список нужен, можно так:

const toHTML = val =>
  val instanceof Object
    ? `<ul>${Object.values(val).map(n => `
         <li>${toHTML(n)}</li>`).join('')}
       </ul>`
    : val;

fetch('https://api.cdnjs.com/libraries/jquery')
  .then(r => r.json())
  .then(r => document.body.insertAdjacentHTML('beforeend', toHTML(r)));

Метод handleCartPriceChange, замените

this.setState({ price: this.state.price + price, title: [this.state.title+title]});

на

this.setState({
  price: this.state.price + price,
  title: this.state.title.concat(title)
});

str_replace($alphabet, array_keys($alphabet), $str)

И вы явно что-то в своём алфавите пропустили - в вашем примере 'к' это 10, а должно быть 11. Забыли про 'ё'?

<button class="btn" data-hover-text="hello, world!!"></button>

.btn {
  border: 0;
  background: green;
  display: inline-block;
  width: 3em;
  height: 3em;
  border-radius: 1.5em;
  overflow: hidden;
  transition: width 0.2s linear;
}

.btn::before {
  display: inline-flex;
  width: 100%;
  height: 100%;
  color: white;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  transition: letter-spacing 0.2s linear;
  letter-spacing: -2px;
  content: ">";
}

.btn:hover {
  width: 10em;
}

.btn:hover::before {
  letter-spacing: 0px;
  content: attr(data-hover-text);
}

https://jsfiddle.net/gbzcsuo2/

const type = document.querySelector('#type');
const price = document.querySelector('#price');

const minPrices = {
  bungalo: 0,
  flat: 1000,
  house: 5000,
  palace: 10000,
};

type.addEventListener('change', function() {
  const minPrice = minPrices[this.value];
  price.min = minPrice;
  price.value = Math.max(minPrice, price.value);
});

type.dispatchEvent(new Event('change'));

Наверное, вместо

this.setState({price});

должно быть что-то вроде

this.setState({ price: this.state.price + price });

И дефолтное значение price - почему пустая строка? Такой суммы не бывает. Бывает 0.

rebase

Никаких событий тут нет. Генерируйте нужное после установки значения вручную:

$(input).val(...).trigger('change');

Что сейчас происходит: нажали на элемент списка, фокус на input'е потерялся, по соответствующему событию список закрылся, отжали кнопку мыши, наконец-то событие клика случилось, но, так как списка уже нет, клик получается по элементу, который скрывался за списком, так что обработчик клика по элементу списка не срабатывает.

Вместо клика обрабатывайте нажатие кнопки мыши, вместо

$('body').on('click', '.help'

пусть будет

$('body').on('mousedown', '.help'

Просто динамически задаёте класс:

<input :class="а здесь выражение, определяющее, какие классы будут добавлены">

Несколько примеров того, как это может выглядеть.