Моя реагирующая навигация SPA в настоящее время отображает страницу примерно на секунду, а затем возвращается на главную страницу.

Question

Моя реагирующая навигация SPA в настоящее время отображает страницу примерно на секунду, а затем возвращается на главную страницу.

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

vals=rbinom(1000,20,0.5)

text=paste0(substr(format(diff(vals),scientific=TRUE),1,1),collapse="")

sort(na.omit(c(gregexpr('[ ]-',text)[[1]]+1,ifelse(grepl('^-',text),1,NA),
 ifelse(grepl('[^-]$',text),length(vals),NA))))

1

reactjs

задан Cyn 26 February 2019 в 05:16

1 ответ

Другие вопросы по тегам:

reactjs

Похожие вопросы:

score 0 · Answer 1

Вот полный рабочий пример .

Ваша первая проблема, я думаю, использует несколько ReactDOM.render с. Боюсь, это не тот случай использования. Вы должны использовать это один раз.

Вторая проблема, которую я вижу, - это дублирование вашей навигации три раза. Если вы извлечете это в свой собственный компонент и вызовете его Navigation, вы можете отрендерить его только один раз. Например:

function Navigation(props) {
    return (
  <ul className="header">
    <li>
      <a href="#" onClick={() => props.onClick("playground")}>
        Playground
      </a>
    </li>
    <li>
      <a href="#" onClick={() => props.onClick("technology")}>
        Technology
      </a>
    </li>
    <li>
      <a href="#" onClick={() => props.onClick("library")}>
        Library
      </a>
    </li>
  </ul>
)}

Тогда вы можете использовать его следующим образом:

function Main() {
  const [page, setPage] = useState("playground");
  return (
    <div>
      <Navigation onClick={setPage} />
      {page === "playground" && <Playground />}
      {page === "technology" && <Technology />}
      {page === "library" && <Library />}
    </div>
  );
}

Если вы не хотите использовать react-router для маршрута на основе рендеринга компонентов, то вам нужно ввести state и переключить компонент на основе state. В вышеупомянутом компоненте Main у меня есть одно состояние, которое может содержать playground, technology или library и на основе текущего значения мы визуализируем соответствующий компонент.