React|antd|table|给某一条数据设置背景色,并滚动到这条数据的位置

  1. 使用 rowClassName 给满足条件的的行设置类名
  2. 根据类名获取该行的 dom元素
  3. 使用 scrollIntoView 让该 dom元素 滚动到中间位置
const tRef = useRef();

// 给 key== 'xxxxx' 的行设置背景色
const rowClassName = ({ key }) => {
    if (key == 'xxxxx')) { // 设置条件
      return `${styles.specialRow}`; // 设置背景色
    }
    return "";
 };

// 滚动到指定位置
useEffect(() => {
    if (tRef && datas.length != 0) {
      let d = document.getElementsByClassName(styles.specialRow)[0];
      d && d.scrollIntoView({ behavior: "smooth", block: "center" });
    }
}, [tRef, datas]);

你可能感兴趣的:(前端,react.js,javascript,前端)