react 实现confirm
import React from 'react';
import './';
class App extends React.Component
{
constructor()
{
super();
this.state=
{
confirmHidden: "hide"
};
this.remove = this.remove.bind(this);
this.confirmClick = this.confirmClick.bind(this);
}
remove()
{
console.log("remove");
this.setState({ confirmHidden: "" })
}
confirmClick(value)
{
// 根据value值执行对应操作
if(value === "ensure")
{
}
else
{
}
}
render()
{
return <div style={ { padding: "0", margin: "0", width: "100%"} }>
<input type="button" value="删除" className="btn ml50" id="remove" onClick={ ()=> this.remove() }/>
<div className={`wrap-dialog ${ this.state.confirmHidden }`}>
<div className="dialog">
<div className="dialog-header">
<span className="dialog-title">删除确认</span>
</div>
<div className="dialog-body">
<span className="dialog-message">你确认删除此条信息？</span>
</div>
<div className="dialog-footer">
<input type="button" className="btn" id="confirm" onClick={ ()=>this.confirmClick("ensure") } value="确认"/>
<input type="button" className="btn ml50" id="cancel" onClick={ ()=>this.confirmClick("cancel") } value="取消"/>
</div>
</div>
</div>
</div>
}
}
export default App;