美文网首页
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