x-dailog ポップアップ ウィンドウ フローティング レイヤー コンポーネントの紹介

react.js プラグイン開発、x-dailog ポップアップ フローティング レイヤー コンポーネント

すべてのコンポーネントには独自のスタイルと属性のイベント コールバック設定が必要だと思います。そこで、x-dialog に単純なデフォルト スタイルとさまざまなデフォルト設定項目を与えます。すべての React プラグインのサンプルは React China に含まれます。

デモアドレス: x-dialogのさまざまなケースのデモ

ソースファイルアドレス:

npmインストール

npmを使用してインストール、実行

$ npm install x-dialog --save-dev

呼び出しメソッド

<Dialog 
      isShow: true  title: "这是一个例子"  className:"myClass"  timer:2000  width:300  height:300  buttons: <div><button className="d-ok" onClick={this.hide.bind(this)}>我知道了</button><button className="d-cancel" onClick={this.hide.bind(this)}>关闭</button></div>  afterShow:()=>alert(&#39;我显示出来了&#39;)
      afterHide:()=>alert(&#39;我又隐藏了&#39;)>
    <div>这里是弹窗的内容区域</div>
</Dialog>

属性メソッド

isShow :bool 型isShow :bool类型

控制弹窗的显示隐藏的.

title:string类型

为空时，不显示标题.

className:string类型

弹窗的样式类

timer:number类型

定时关闭，可不传。

width:number类型

弹窗宽度，不足时，内容区域出现上下滚动

height:number类型

弹窗宽度，不足时，内容区域出现上下滚动

buttons:node类型

自定义操作区域的按钮,为false类型时不显示操作区域，不传时默认显示 `确定、取消`

okCallback:func类型

当默认按钮的情况下时，点击`确定`时的回调方法，点`取消`时直接隐藏，如果需要定制更多的方法，建议传递`buttons`属性。

afterShow:func类型

显示的回调方法

afterHide

关闭隐藏时的回调方法

title:string type

rrreee🎜🎜 🎜🎜className:string type🎜🎜rrreee🎜 🎜 🎜🎜タイマー:数値型🎜🎜rrreee🎜🎜 🎜🎜幅:数値型🎜🎜rrreee🎜🎜🎜🎜高さ:数値型🎜🎜rrreee🎜🎜 🎜🎜ボタン: ノードタイプ 🎜🎜rrreee🎜🎜 🎜🎜okCallback: func タイプ 🎜🎜rrreee🎜🎜 🎜🎜afterShow:func type🎜🎜rrreee🎜🎜🎜🎜afterHide:func type🎜🎜rrreee🎜🎜添付ファイル：react.jsのダウンロードアドレス🎜