Não existe two-way data binding em React?

Olá, tudo bem?

Estou começando a estudar React depois de um bom tempo trabalhando com o framework Vue.

Nesse módulo, vimos como utilizar o bind nativo do Javascript para definir o this que será utilizado em nossos handlers. Tudo isso para mantermos atualizado o valor da variável titulo, definida no construtor.

No Vue, eu posso simplesmente passar uma propriedade model ou v-bind como prop do componente de input e quaisquer mudanças realizadas na variável ou no input são replicadas de uma para outra. Conheço essa técnica pelo nome de two-way data binding.

Como conheço muito pouco de React, não quero criar uma impressão falsa, descontextualizada. Mas com o que vi no vídeo, me pareceu muito esforço de implementação para simplesmente manter o valor da variável atualizado, ainda mais em se tratando de um framework reativo.

É isso mesmo?

Olá, Luís! Tudo bem?

Você está correto, não existe two-way data-binding no React. Isso acontece porque há um problema de definição de React, como você bem disse é estranho não ter isso em um framework reativo, mas em sua implementação o React não é um framework (hoje em dia trabalhamos com ele como framework, mas a própria ferramenta não se considera como tal).

Isso significa, entre outras coisas, que a biblioteca se limita a apenas oferecer ferramentas e não uma sintaxe. Isso, em um primeiro momento, parece mentira porque o JSX é uma sintaxe inteiramente diferente do existente no HTML e no JavaScript, mas ainda assim permite apenas JavaScript e HTML.

No Vue e no Angular usamos diretivas para fazer esses controles de dados nas views, e diretivas são um claro exemplo de sintaxe adicional. No React, todo esse trabalho é delegado ao JavaScript puro, já que é possível inserir JS no JSX. O v-model nada mais é do que a união de um v-bind com um v-on, o Vue oferece o v-model como um atalho para facilitar o desenvolvimento. Já no React, não temos esse atalho intencionalmente, pois devemos usar o JavaScript para criar nossas próprias soluções, usando value e onChange.

Resumindo: não possui two-way data binding pois isso seria uma camada de abstração entre o código e o desenvolvedor que o React preferiu não implementar.

Bons estudos!