React.js. Отслеживание элементов. Пример: работа со style при движении мыши?

Question

[KnightForce]

Изучаю React.js и попробовал сделать перетаскивание элемента (не Drag'n'Drop).
Сделал 2 варианта:
1) Через state меняю style у компонента.
2) Через ref, используя нативный element.style.

Второе работает быстрее.

Так вот в чем вопрос:
Если менять через state - то все согласно логике React, а если через ref почему при вызове render() не сносится style? Его же нет в объекте компонента React. Или отслеживается только то что было прописано в компоненте?

Answer 1

[Vlad Feninets]

setState автоматически вызывает метод render у компонента.
можно заюзать forceUpdate после изменения style через ref.

Comments

[KnightForce]

Я имел в виду, при работе с о style не через React, а напрямую через DOM, почему render() не сносит добавленные стили? Ведь "записи" о них нет в React.

[Vlad Feninets]

если обращаться по рефу, то этот элемент трекается в virtual dom, а вот если прямо из консоли сделать манипуляции в ДОМ, то реакт их через какое-то время заревёртит.

[KnightForce]

Vlad Feninets: изменения через ref фиксируются в virtual dom, а если, например, обратиться откуда-нибудь через jQuery - то изменения снесутся. Все правильно понял?

[Vlad Feninets]

KnightForce: должно быть так