В чем разница между реактивностью в React и Vue

«В чем разница между реактивностью в React и Vue» — вопрос из категории React, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

React использует односторонний поток данных и управляет реактивностью через состояние (state) и пропсы. Обновление интерфейса происходит при изменении состояния через setState или хуки (useState). React сравнивает Virtual DOM и обновляет только изменившиеся части.

Vue использует двустороннюю привязку данных через систему реактивности на основе геттеров/сеттеров (Proxy в Vue 3). При изменении данных Vue автоматически обновляет DOM без явного вызова методов обновления.

Пример React:

const [count, setCount] = useState(0);
// Явное обновление
<button onClick={() => setCount(count + 1)}>

Пример Vue:

<template>
  <button @click="count++">{{ count }}</button>
</template>
<script>
export default {
  data() { return { count: 0 } }
}
</script>

React требует ручного управления обновлениями, Vue автоматизирует реактивность.