## API 属性 | 说明 | 类型 | 默认值 -----|-----|-----|------ show | 是否显示，可选 | boolean | `false` getContainer | 获取父容器的方法，可选，如果不传默认是`document.body` | function | - mask | 是否显示遮罩层，可选 | boolean | `false` maskClassName | mask的className，可选 | string | - onMaskClick | mask点
npm install @rc-hooks/dialogfalsedocument.body | function | -falseIRcPosition定义 | - | -typescript jsx
export type IRcPositionHorizontal = 'left' | 'center' | 'right' | 'dock'; export type IRcPositionVertical = 'top' | 'center' | 'bottom' | 'dock';
interface IRcHorizontal {
horizontal: IRcPositionHorizontal;
left?: number;
right?: number;
}
interface IRcVertical {
vertical: IRcPositionVertical;
top?: number;
bottom?: number;
}
export type IRcPosition = IRcHorizontal & IRcVertical;
`用法
typescript jsx
import React, {useState, useRef} from 'react';
import {RcDialog} from '../src';
import {useContainer} from '@co-hooks/util';
import {Button} from '../../ui'; export default (props: {}) => {
const divRef = useRef(null);
const [show, setshow] = useState(false);
const getContainer = useContainer(divRef);
const maskStyle = {
background: 'rgba(0, 0, 0, .2)'
};
return (
有内容的div
getContainer={getContainer}
horizontal="center"
vertical="center"
mask={true}
onMaskClick={() => setshow(false)}
maskStyle={maskStyle}
>
我是用了指定父级的浮层
);
};
``