react-hook引用过时闭包的问题？？？react 大.神进！！

Question

首先是在函数组件中，用hook api申明了一个state：
const [streamListParams, setStreamListParams] = useState<Array<any>>([]);

第一个useEffect用来获取列表数据：
` // 获取数据的副作用
useEffect(() => {

getProductList("11", "22")
  .then((data) => {
    console.log("data", data);
    setcounter(streamListToCounter(data.streamList));
    setStreamList(streamListAddFather(data.streamList));
    setStreamListParams(streamListToParams(data.streamList));
  })
  .catch((err) => {
    console.log("err", err);
  });

}, []);
`

第二个useEffect用来监听streamListParams变化，创建可拖拽排序列表：

function sortCom(data: any, e: any) {
    const tmp = JSON.parse(JSON.stringify(data));
    console.log("sortCom 排序前:", tmp);
    console.log(e.oldIndex, e.newIndex);
    // console.log("排序前", tmp);
    let movedRow = tmp[e.oldIndex - 1];
    console.log("movedRow", movedRow);
    tmp.splice(e.oldIndex - 1, 1);
    tmp.splice(e.newIndex - 1, 0, movedRow);
    console.log("排序后：", tmp);
    setStreamListParams(tmp);
  }
  // 拖拽属性生成的副作用;
  useEffect(() => {
    console.log("拖拽useEffect进来了", streamListParams);

    // const newfunc = (function(streamListParams) {
    //   console.log("``````", streamListParams);
    //   return (evt: any) => sortCom(streamListParams, evt);
    // })(streamListParams);

    // if (dragableList === null) {
    dragableList = Sortable.create(sortTree.current, {
      sort: true,
      scroll: true,
      handle: ".my-draggable-content",
      onStart(evt) {
        evt.oldIndex;
      },
      onEnd(evt) {
        sortCom(streamListParams, evt);
      }
    });
    // }
    // else {
    //   dragableList.option("onEnd", (evt: any) => {
    //     sortCom(streamListParams, evt);
    //   });
    // }
  }, [streamListParams]);

可实际结果是，拖拽后：

sortCom传进来的streamListParams始终是useEffect第一次执行的[]空数组，sortCom执行了空数组操作之后才变成了[undefined]，看上去应该是闭包缓存了streamListParams这个变量，声明时就确定了。可是按照这个思路也没改成功，求教有经验的react hook 大佬怎么解决这个问题！

Answer 1

解决喽，存useRef就行喽

Answer 2

没看太仔细，不是很理解 第二个为何要使用 useEffect 监听 streamListParams，只用一个即可。

如果是这样的话 因为 streamListParams 变化，会导致每次都调用 Sortable.create。这个会有问题

只需要一个 useEffect， 在取得数据时候利用函数 Sortable.create 就可以了，然后后面只是修改 list 啊。

个人认为，可以预料到结果的数据，不需要 useEffect。而且你每次修改列表，都会引起重新 useEffect。性能上也并不好。

有用请采纳