设置scrollTop无效（react）

参考文献：
1.https://zhuanlan.zhihu.com/p/342492702
2.https://www.jianshu.com/p/4c9e59b84674
3.https://blog.csdn.net/weixin_39948247/article/details/111338810?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-1.no_search_link&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-1.no_search_link

设置scrollTop的方法

参考上面三个文献里的方法

方法一：scrollTo
https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTo

	let train_list = document.querySelector("#train_list");
    // 设置滚动条的高度
    train_list.scrollTo(0, 600);

方法二：

	let train_list = document.querySelector("#train_list");
    // 设置滚动条的高度
    train_list.scrollTop = $train_list.scrollHeight;

方法三：

let train_list = document.querySelector("#train_list");
 train_list.scrollBy(0, 100);  // or window.scrollBy({   left: 0,   top: 100 }); 

害，不生效原因很恶心，因为层级的问题，这个真的很难排查到。
你设置的css： overflow-y: scroll; 的层级，必须要是在你元素map的上一级才可以。

注意一定要注意，元素map的上一级才可以

   <div className={
    
    styles.box}>
   //注意，一定要在map的上一层设置你的元素id滚动条
          <div className={
    
    styles.box_bd} id='train_list'>
            {
    
    talkItems?.length > 0 &&
              talkItems.map((item: any, index: number) => (
              <div key={
    
    index}>
              {
    
    item}
         		 </div>
               ))} 
          </div>
        </div>

//CSS
  .box {
    
    
      position: relative;
      height: 100%;
      overflow: hidden;
      display: flex;
      flex-flow: column;
         .box_bd {
    
    
	      overflow-y: scroll;
	      overflow-x: hidden; // 重点
	      flex: 1;
	    }
    }