react 里面 父组件状态变化 子组件的useeffect一直被触发,求解决办法

Question

  componentDidMount () {
    document.querySelector(".router").addEventListener("scroll", () => {
      this.showTop()
    })
  }
  showTop = () => {
    let topValue = document.querySelector(".showimg").getBoundingClientRect().top;
    if (topValue <= 5 && topValue > 0) {
      this.setState({ searchStatus: false })
    }
    else if (topValue >= -5 && topValue < 0) {
      this.setState({ searchStatus: true })
    }
  }

监听滚轮,改变了一个状态

子组件里面 的useEffect一直被触发

import React, { useEffect, useState } from 'react';
import Swp from "swiper";
import "swiper/swiper.min.css";

export default function Swiper (props) {
  const [list, setList] = useState([])
  useEffect(() => {
    setList(props.list)
    console.log(props.list, "nihao1")
    new Swp(".swiper-container", {
      loop: true, // 循环模式选项
    }, [])
  })
......
}

Answer 1

用useMemo这个是当依赖发生变化才重新改变,useEffect默认每次都运行这个只是执行副作用