每日質量NPM包模態框 react modal

2022-01-15 03:46:10 字數 1021 閱讀 1490

官方定義:accessible modal dialog component for react.js理解: 乙個容易使用的react模態框元件

有時候我們不用一些ui框架的時候(bs3.0、antd),就需要自己封裝一些模態框.自己定義各種**事件...等等

這時候可以考慮用乙個npm模態框的包

安裝```

$ npm install react-modal

import reactmodal from 'react-modal'

事件isopen: 模態框狀態控制onafteropen: 模態框開啟後的**事件onrequestclose: 模態框關閉後的**事件style: 模態框樣式,預設以`content`為預設應用名contentlabel: 內容label
import react, from 'react'

import reactmodal from 'react-modal'

const customstyles = ,

btn:

};export default class reactmodalcomp extends purecomponent

this.openmodal = this.openmodal.bind(this)

this.closemodal = this.closemodal.bind(this)

}openmodal())

}closemodal())

}afteropenmodalev()

render() = this.state;

return(

開啟關閉

)}

!(

更多demo

《基礎modal》

《結合onrequestclose》

《使用樣式的modal》

《shouldcloseonoverlayclick》

發布npm包,刪除npm包

完成了上面的步驟之後,我們接下來要在www.npmjs.com註冊乙個賬號,這個賬號會被新增到npm本地的配置中,下面命令行將會使用到。前提已完成npm使用者的註冊 npm adduser username your name password your password email yourmai...

npm離線安裝npm包

以安裝git為例 使用 npm install 同樣以git為例,首先我們需要準備git包,可以在聯網的機器上執行 npm installgit global style 上面的 global style 很關鍵,表示將git安裝到node modules中乙個單獨的git資料夾中,這樣我們可以方便...

npm包發布流程

1.npm 是什麼 2.安裝npm npm 不需要單獨安裝,在安裝node的時候,會連帶一起安裝npm。但是,node附帶的npm可能不是最新的版本,可以用以下命令更新到最新版本。npm install npm latest g 安裝完檢視npm版本 npm v 6.0.1 3.npm發布流程 1....