html输入提示框点击确认显示内容,前端 自定义确认提示框（二）

以上demo，完整案例请下载：example-MyconfirmDialog

或者访问github地址：https://github.com/Kybs0/Kybs0HtmlCssJsDemo/tree/master/definedAlertWindow

自定义动态确认框

假如一个页面有多个业务需要确认框，上面的确认框就显得代码冗余了。

下面提供一个确认框的组件：

1. 定义弹出框的组件

安装动画过渡组件 ReactCSSTransitionGroup  -- yarn add ReactCSSTransitionGroup

ReactCSSTransitionGroup可以在切换界面时，有一个过渡的视觉效果。

在ReactCSSTransitionGroup内部添加弹框内容：提示文本、确认按钮、取消按钮。

创建一个div容器，并将组件添加到容器中。

默认为提示框。如果传入取消按钮的文本，则为确认/取消框。

代码与前端 自定义弹出框-提示框类似：

1 import React, { Component } from 'react';

import { is, fromJS } from 'immutable';

import ReactDOM from 'react-dom';

import ReactCSSTransitionGroup