2017-02-03 3 views
1

Я очищаю веб-сайт, который использует React для front-end. Пока мне кажется, что я должен использовать свою форму поиска, чтобы попасть на страницу результатов.Как React хранит и реагирует на изменение состояния точно?

Проблема заключается в том, что сайт удаляет выбранные параметры формы поиска из выпадающего списка (его state) каждый раз, когда страница обновляется, и поэтому она значительно ускоряет соскабливание. Я знаю, что он работает так, как предполагалось, но если бы я мог напрямую манипулировать состоянием, тогда он мог бы ускорить мой скребок, а не перебирать все варианты с маленьких кнопок.

Я не думаю, что он использует любой тип постоянного хранения или локального хранения на всех, для каждого выбора, в противном случае форма, вероятно, не будет очищена от обновления.

Я вижу, что варианты лет для формы всегда присутствуют в атрибуте data- (data-years=["2017", "2016", ...]), но только на годы. И когда выбран год (или любой вариант из выпадающих списков), скрытое поле заполняется значением <input type="hidden" name="year" value="2017">.

Это все, что React использует для временного хранения (ака. состояние) -крытые поля?

И для второй части моего вопроса, какое событие вызывается при изменении состояния? Как я могу запустить его вручную? Например, когда я выбираю год, я хочу, чтобы форма давала мне варианты для следующего раскрывающегося списка, указанного в году.

+0

«Это все, что React использует для временного хранения (иначе говоря,« состояние »)? В Реактите нет никакого способа управлять состоянием. Однако использование скрытых полей для этой цели, если это так, происходит очень необычно. –

+0

Я согласен, для React было необычно использовать скрытые поля. Но когда вы говорите: «Нет способа управлять государством в реактиве», вы имеете в виду, что разные версии React управляют состоянием иначе? Или что React управляет состоянием по-разному в зависимости от того, является ли это React prop или state set with [email protected] – geminae

ответ

3

React не использует DOM для поддержания состояния. Пример, который вы предоставили, - это просто плохо написанное приложение React. Обычно все будет храниться в памяти (закрытый код так ничего в окне/глобальном), и React обновит DOM по своему усмотрению. :)

Это означает, что я не думаю, что вы сможете читать/обнаруживать изменения внешнего состояния React извне. Интерактивная очистка должна работать как пользователь, использующий эту страницу, без каких-либо намеков на то, что технология действительно использует.

В зависимости от технологии, которую вы используете для очистки, вы действительно можете имитировать или генерировать реальные события DOM. Когда нам нужно написать несколько тестов конца для приложения React с помощью вездесущего сервера Selenium, мы обычно должны вручную ввести click на кнопках, опциях и т. Д. И дать время для приложения React соответствующим образом реагировать и делать свою магию (например, выборка больше данных и обновления страницы), а затем читать содержимое документа, чтобы убедиться, что все работает. Это в основном «соскабливание» с желаемым результатом проверки, ваши тестовые утверждения.

Если вы очищаете только статические страницы (стиль завитки: выборка HTML и работа с исходным HTML-ответом), я не думаю, что вы сможете обрабатывать форму Javascript. Вам нужно, чтобы ваш скребок был интерактивным.

Возможно, что-то вроде PhantomJS, кроме упомянутого Selenium/WebDriver.

+0

Я боялся, что это будет так - это состояние хранится в памяти с закрытым кодом. Это поразительно. В самом деле, я определенно использую «интерактивный скребок» - не мог бы сделать это иначе с сайтом React. Спасибо за Ваш ответ! Я бы поднял его, если бы у меня были очки :). – geminae

+0

Без проблем удачи! ;) – CharlieBrown

Смежные вопросы