useToggle组件封装

只针对对Boolean之间的切换，简洁直观

import { useState } from 'react';
const useToggle = (initialState:boolean = false) => {
const [toggle, setToggle] = useState(initialState);
const switchToogle: any = () => {
setToggle(!toggle);
};
return [toggle, switchToogle];
};
export default useToggle;

使用实例：

import * as React from 'react';
import useToggle from '../useToggle/index'
import { Modal} from 'antd'
export default function Name() {
const [tagVis, setTagVis] = useToggle(false)
const changeModal=()=>{
setTagVis() //调用函数即可来回切换Modal展示
}
return (
<div>
<Modal
title={tagTitle}
visible={tagVis}
onCancel={changeModal}
onOk={changeModal}
>
切换modal来回展示！！！
</Modal>
</div>
)
}

最后

以上就是深情月饼为你收集整理的useToggle组件封装useToggle组件封装的全部内容，希望文章能够帮你解决useToggle组件封装useToggle组件封装所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。