All files / src/modal/_example ModalMaskClosableExample.jsx

66.67% Statements 4/6
100% Branches 0/0
33.33% Functions 1/3
100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31            1x   1x 1x   1x                                      
import React, { Fragment, useState } from "react";
import { Modal } from "@tencent/tea-component/lib/modal";
import { Button } from "@tencent/tea-component/lib/button";
import { DatePicker } from "@tencent/tea-component/lib/datepicker";
 
export default function ModalBasicExample() {
  const [visible, setVisible] = useState(false);
 
  const open = () => setVisible(true);
  const close = () => setVisible(false);
 
  return (
    <Fragment>
      <Button type="primary" onClick={open}>
        打开
      </Button>
      <Modal
        maskClosable
        visible={visible}
        caption="对话框标题"
        onClose={close}
      >
        <Modal.Body>
          <DatePicker />
        </Modal.Body>
        <Modal.Footer />
      </Modal>
    </Fragment>
  );
}