Javascript 如何将页面移动到'；页面加载'？ 我可以检测到锚点的变化，如下所示：

/ScrollToPart：

import React from 'react';
import { withRouter } from 'react-router-dom';

class ScrollToPart extends React.PureComponent {

 componentDidMount() {
   // I want to scroll to the view.
   this.scroll();
 }

 componentDidUpdate(prevProps) {
  // Scroll when location changes.
  if (this.props.location !== prevProps.location) {
    this.scroll();
   }
  }

 scroll() {
   // Get the '#' id from the location 
   const id  = (
     this.props.location && this.props.location.hash
   ) ? this.props.location.hash : null;
    if (id) {
       element = document.getElementById(id.split('#').join(''));
       // If element present, scroll me to that part 
       if (element) {
         element.scrollIntoView();
       } else {
         // If element not present, scroll me to the top
         window.scrollTo(0, 0);
       }
     } else {
       // In no anchor element, scroll me to the top
       window.scrollTo(0, 0);
     }
   }

  render() {
    return this.props.children;
  }
 }
 export default withRouter(ScrollToPart);

我在此组件中插入了我的

应用程序

：

在应用程序中的一个组件中，这是列表，其中 字幕：

从“../PageSubtitle”导入PageSubtitle；
从“React”导入React；
从'react router dom'导入{Link}；
类EmailList扩展了React.PureComponent{
//此函数用于获取现有的查询参数
//保持原样。
getQueryParameterPath=（）=>{
const{location}=this.props；
const params=新的URLSearchParams（location.search）；
let path='/dashboard/emails？'；
if（params.get（'my-page'）&¶ms.get（'my-page'）.toString（）！=''）{
path=path+'&my-page='+params.get（'my-page'）；
} 
if（params.get（'team-page'）&¶ms.get（'team-page'）.toString（）！=''）{
path=path+'&team-page='+params.get（'team-page'）；
}
返回路径
}
render（）{
//这是我需要移动到的“id”。它只是一个
//父组件中的字符串。
//listId='my list'和其他时间listId='team list'
const{listId}=this.props；
返回(
标题
);
}
}
导出默认邮件列表；

那么现在../PageSubtitle

从“道具类型”导入道具类型；
从“React”导入React；
从“@material ui/core/Typography”导入排版；
const PageSubtitle=（{children，…other}）=>(
{儿童}
);
导出默认页面字幕；

使用

ScrollToPart

我可以检测到锚定链接的变化，我可以移动到该特定部分。（我有一些分页功能，可以导航到“我的列表”和“团队列表”）

加载页面时，我无法移动到任何一个部分。 当页面加载/重新加载时，

元素在
ScrollToPart
组件中作为null传递。

你能帮忙吗
 以下是答案

只需设置计时器，直到找到元素。

希望这有帮助
我找到了答案：
 <ScrollToPart>
   <App />
 </ScrollToPart>

    import PageSubtitle from '../PageSubtitle';
    import React from 'react';
    import { Link } from 'react-router-dom';

    class EmailList extends React.PureComponent {

      // This function is to get the existing Query parameters
      // and keep them as it is.
      getQueryParameterPath = () => {
        const { location } = this.props;
        const params = new URLSearchParams(location.search);


        let path = '/dashboard/emails?';
        if (params.get('my-page') && params.get('my-page').toString() !== '') {
          path = path + '&my-page=' + params.get('my-page');
        } 
        if (params.get('team-page') && params.get('team-page').toString() !== '') {
          path = path + '&team-page=' + params.get('team-page');
        }

        return path
      }

      render() {
        // This is the 'id' to which I need to move. It's just a 
        // string in its parent component.  
        // listId = 'my-list' and other time listId = 'team-list'
        const { listId } = this.props;

        return (
          <div id={listId}>
            <PageSubtitle 
              inline={true} 
              component={Link}
              to={`${this.getQueryParameterPath()}#${listId}`}
            >
              Title
            </PageSubtitle>
          </div>
        );
      }
    }

    export default EmailList; 

    import PropTypes from 'prop-types';
    import React from 'react';
    import Typography from '@material-ui/core/Typography';


    const PageSubtitle = ({ children, ...other }) => (
      <Typography
        variant="h6"
        {...other}
      >
        {children}
      </Typography>
    );

    export default PageSubtitle;