useState не поддерживает второй callBack, что может быть легко исправить? - PullRequest
Новая
       12

useState не поддерживает второй callBack, что может быть легко исправить?

0 голосов
/ 02 мая 2019

Это мой useEffect 

useEffect(() => {
    let pageId =
      props.initialState.content[props.location.pathname.replace(/\/+?$/, "/")]
        .Id;

    if (props.initialState.currentContent.Url !== props.location.
      setCurrentContent({ currentContent: { Name: "", Content: "" } }, () => {
        fetch(`/umbraco/surface/rendercontent/byid/${pageId}`, {
          credentials: "same-origin"
        })
          .then(response => {
            if (response.ok) {
              return response.json();
            }
            return Promise.reject(response);
          })
          .then(result => {
            setCurrentContent({
              currentContent: { Name: result.Name, Content: result.Content }
            });
          });
      });
    }
  }, []);

Я пробовал что-то вроде useCallback / useMemo, но все же не повезло, я уверен, что это простое исправление, но я, должно быть, упускаю более широкую картину, заранее спасибо.

1 Ответ

1 голос
/ 02 мая 2019

То, что вы можете сделать, это написать эффект, который проверяет, является ли состояние currentContent измененным и пустым, и предпринимает необходимые действия.Однако вы должны игнорировать начальный рендер.Также отключите setState в компонентах класса, вы не передаете значение состояния как объект, а просто передаете обновленное состояние 

const ContentPage = props => {
   const [currentContent, setCurrentContent] = useState({
    Name: props.initialState.currentContent.Name,
    Content: props.initialState.currentContent.Content
   });

  const initialRender = useRef(true);

   useEffect(() => {
     let pageId =
       props.initialState.content[props.location.pathname.replace(/\/+?$/, 
     "/")]
         .Id;
     if (
       initialRender.current &&
       currentContent.Name == "" &&
       currentContent.Content == ""
     ) {
       initialRender.current = false;
       fetch(`/umbraco/surface/rendercontent/byid/${pageId}`, {
         credentials: "same-origin"
       })
         .then(response => {
           if (response.ok) {
             return response.json();
           }
           return Promise.reject(response);
         })
         .then(result => {
           setCurrentContent({ Name: result.Name, Content: result.Content });
         });
     }
   }, [currentContent]);

   useEffect(() => {
     if (props.initialState.currentContent.Url !== props.location) {
       setCurrentContent({ Name: "", Content: "" });
     }
   }, []);
   ...
 };


 export default ContentPage;
...