react-alert-confirm

A react component confirm dialog, support async/await mode call（一个 React 确认对话框组件，支持 async/await 方式调用）

Docs

Documentation pages（在线文档）

Preview on CodeSandbox（在线预览）

Installing

yarn add react-alert-confirm
# or
npm install react-alert-confirm --save

Usage

import 'react-alert-confirm/lib/style.css';
import AlertConfirm from 'react-alert-confirm';

Imperative

import AlertConfirm from 'react-alert-confirm';

const openConfirm = async () => {
  const [isOk] = await AlertConfirm('Are you sure?');
  if (isOk) {
    console.log('ok');
  }
};

const openConfirm2 = () => {
  AlertConfirm({
    title: 'Are you sure?',
    desc: 'description...',
    onOk: () => {
      console.log('ok');
    },
    onCancel: () => {
      console.log('cancel');
    }
  });
};

const openAlert = async () => {
  await AlertConfirm.alert('Are you sure?');
  console.log('ok');
};

const openAlert2 = async () => {
  await AlertConfirm.alert({
    title: 'Are you sure?',
    desc: 'description...'
  });
  console.log('ok');
};

Render JSX

import React, { useState } from 'react';
import AlertConfirm from 'react-alert-confirm';

const Component = () => {
  const [visible, setVisible] = useState(true);

  return (
    <AlertConfirm
      visible={visible}
      title="Are you sure?"
      desc="description..."
      onOk={() => {
        console.log('ok');
        setVisible(false);
      }}
    />
  );
};