美文网首页
react hooks useState,useCallback

react hooks useState,useCallback

作者: _一九九一_ | 来源:发表于2019-07-12 12:02 被阅读0次
  • 下面代码中的requestList是一个列表查询接口,用useCallback包起来,第二个参数依赖一改变就会请求接口
  • 当删除列表其中一行的时候,改变一下setFilterParams({}),就可以自动触发请求
  • 当添加列表其中一行的时候,改变一下setFilterParams({}),就可以自动触发请求
import React, { useState, useEffect, useCallback } from 'react';

const [ visible,setVisible ] = useState(false);
const [filterParams, setFilterParams] = useState({});  // 查询表单的参数

function cmp(props) {
  const requestList = useCallback(async (page) => {
    const res = await get_list({ ...filterParams, page});
    console.log(res)
  },[filterParams])  // 当filterParams被setFilterParams以后,会自动执行


  useEffect( () => { 
    requestList();
  }, [requestList])

  useEffect(()=>{
    setVisible(props.visible); 
  },[props.visible])

  // 执行查询表单方法的时候,比如点击查询按钮,改变一下请求参数 就自动调用requestList()请求
  const handleFilterSubmit = (filterParams) => { 
    setFilterParams(filterParams) 
  };
」

相关文章

网友评论

      本文标题:react hooks useState,useCallback

      本文链接:https://www.haomeiwen.com/subject/hbtekctx.html