react 无状态写法 带参函数的写法和调用

在无状态组件中,无参函数我们可以直接调用如:

    //无参函数
    function extendsArticle() {
        dispatch({
            type: 'forum/extendsArticle',
            payload: {
                IsVisible:IsVisible == 'inline' ? 'none' : 'inline'
            }
        })
    }

   //直接调用
 

对于带参函数,上文的写法将导致页面初始化时便调用函数,而状态的改变又会引起页面刷新,最终可能会导致页面函数调用死循环。所以写法有所改变:

  //函数
    function extendsArticle(e) {
    //获取button中的 x的值
        let x = e.target.value
        let res = IsVisible
        res[x] = (IsVisible[x] == "inline" ? "none" : "inline")
        dispatch({
            type: 'forum/extendsArticle',
            payload: {
                IsVisible: res
            }
        })
    }

//调用
 

你可能感兴趣的:(react 无状态写法 带参函数的写法和调用)