Реагировать на странные изменения состояния поведения - PullRequest
Новая
       24

Реагировать на странные изменения состояния поведения

1 голос
/ 29 апреля 2020

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

Когда я делаю это: 

const useRoute = () => {
  const [state, setState] = useState({route: "", headerRouteName: ""});

  useEffect(() => {
    console.log("(2)", state);
  }, []);

  const setActiveRoute = (route, headerRouteName) => {
    setState({route: route, headerRouteName: headerRouteName});
    console.log("(1)", state);
  }

  return {setActiveRoute, state};
};

export default useRoute;

и a в одном маршруте: 

  const {setActiveRoute, state} = useRoute()

  useEffect(() => {
    setActiveRoute("login", "Login");
  }, []);

и в приложении. js

  const {setActiveRoute, state} = useRoute()
  const {route, headerRouteName} = state

  useEffect(() => {
    console.log("route:", route, headerRouteName);
  }, [route, headerRouteName]);

my chrome консоль возвращает эти значения: 

Navigated to http://localhost:3000/
[HMR] Waiting for update signal from WDS...
(2) {route: "", headerRouteName: ""}
(1) {route: "", headerRouteName: ""}
(2) {route: "", headerRouteName: ""}
route:

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

const useRoute = () => {
  const [state, setState] = useState({route: "", headerRouteName: ""});

  useEffect(() => {
    setState({route: "route", headerRouteName: "headerRouteName"});
    console.log("(2)", state);
  }, []);

  const setActiveRoute = (route, headerRouteName) => {
    console.log("(1)", state);
  }

  return {setActiveRoute, state};
};

export default useRoute;

chrome возвращает: 

Navigated to http://localhost:3000/
[HMR] Waiting for update signal from WDS...
(2) {route: "", headerRouteName: ""}
(1) {route: "", headerRouteName: ""}
(2) {route: "", headerRouteName: ""}
route:  
route: route headerRouteName

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

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

...