NEJ :Web前端開發框架

jopen 12年前發布 | 49K 次閱讀 JavaScript開發 JavaScript

NEJ 是由網易前端組工程師們發起創建的簡潔,美觀,真正的跨平臺web前端開發框架;她遵循的原則是 自由定制、小巧靈活、簡潔易用、愉悅編碼、快樂開發。
NEJ是一個簡潔、美觀,真正跨平臺的javascript開發框架。它擁有依賴管理,多平臺適配,自由定制,新技術應用,多方案集成和多工具支持六大特性。 

  • Nice Easy Javascript:Web前端開發框架

    suggest - 建議提示控件

    用 戶在input控件里輸入字符,把字符拼接成完整的郵箱地址,方便用戶快速選擇輸入,此控件是util控件,需要在參數里傳入相應的html結構,在用法 上和ui的suggest的區別就是ui suggest的html結構是控件生成,util的suggest控件是需要傳入html結構body參數傳入,再設置提示列表

  • Nice Easy Javascript:Web前端開發框架

    tab - 標簽切換控件

    用于頁面上同一組標點擊切換時,改變選中狀態,觸發切換后的事件回調

  • Nice Easy Javascript:Web前端開發框架

    selector - 選中控件

    該控件是用來選中一個列表中的列表項,和桌面操作系統上的ctl 和shift一起合用,來選中一些需要的項,selector可以的選擇框可以自定義樣式

  • Nice Easy Javascript:Web前端開發框架

    slider - 滑塊控件

    滑塊控件是進度條控件,可以用來音量調節,播放器進度條等由鼠標移動觸的值改變的控件,可以是橫向變值,也可以縱向變值

  • Nice Easy Javascript:Web前端開發框架

    resize - 調整大小控件

    對一個節點需要進行鼠標大小調整,可以用這個控件來實現,但ui上的結構需要傳給resize控件,四周的8個節點需要在結構上進行傳入

  • Nice Easy Javascript:Web前端開發框架

    region - 地區選擇控件

    緩存里已經把中國的省份,城市,地區的數據緩存在cache里,可以直接應用_$$RegionCacheZH,把相關的數據取出來

  • Nice Easy Javascript:Web前端開發框架

    dragger - 拖動控件

    一個節點需要由鼠標拖動改變位置

  • Nice Easy Javascript:Web前端開發框架

    event - 控件基類

    所 有的控件都繼承于event類,ui控件,util控件都繼承于此,他的核心是管理事件,在添加完事件后,可以用 _$dispatchEvent('eventtype'),來觸發eventtype的回調事件,控件需要和個界進行通信,都是在reset時把事件添 加,要通信時dispatchEvent觸發事件回調,以達到模塊外部的邏輯改變

  • Nice Easy Javascript:Web前端開發框架

    dispatcher - 模塊調度器控件

    當hash改變時,按需要載入一個模塊并展示在網頁上,模塊調度器,可以根據hash的umi調度出相應的模塊

  • Nice Easy Javascript:Web前端開發框架

    card - 卡片控件

    卡片控件是一類生成后,在任文檔的任何地方有點周時,卡片都會被隱藏,如在allocate時傳的參數是destroyable為true,在隱藏時卡片回收了制作卡片類需要的步驟是

  • Nice Easy Javascript:Web前端開發框架

    datepick - 日期選擇控件

    日歷控件,用戶選擇時期時的控件,此控件是ui控件,已經生成了相關的html結構,只要傳相關的clazz樣式,對clazz下的樣式進行調整就可以應用自己的樣式需求

  • Nice Easy Javascript:Web前端開發框架

    editor - 富文本編輯器控件

    富文本編輯器是一種可內嵌于瀏覽器,所見即所得的文本編輯器,類似于word編輯器

  • Nice Easy Javascript:Web前端開發框架

    item - 列表項控件

    item列表項結構,是一個項的結構,如果要做一個列表,先把列表的項的結構取出來,從item項里繼承過來

  • Nice Easy Javascript:Web前端開發框架

    loading - Loading動畫生成器

    Loading控件,此控件是ui控件,已經生成了相關的html結構 ,為css3實現,只要傳入父節點會生效

  • Nice Easy Javascript:Web前端開發框架

    loadmore - 加載更多控件

    loadmore控件,此控件是ui控件,已經生成了相關的html結構,只要傳相關的clazz樣式,對clazz下的樣式進行調整就可以應用自己的樣式需求

  • Nice Easy Javascript:Web前端開發框架

    mask - 遮罩控件

    mask控件,此控件是ui控件,已經生成了相關的html結構,你需要將其添加到dom中的任何位置,當遮罩開啟時會并在content中

  • Nice Easy Javascript:Web前端開發框架

    page - 分頁器控件

    pager控件,此控件是Util功能腳本,封裝分頁邏輯實現,你需要定義自己的樣式和html節點,并且傳入實現分頁器邏輯所需的dom節點

  • Nice Easy Javascript:Web前端開發框架

    Pager - 分頁器控件

    pager控件,此控件是ui控件,已經生成了相關的html結構,你需要將其添加到dom中的任何位置,pager將自動生效,傳入clazz參數來定制你的分頁器

  • Nice Easy Javascript:Web前端開發框架

    range - 范圍選擇控件

    range控件,此控件是ui控件,只需要傳入父節點即可生效。可以在父節點內選擇一個矩形范圍。

  • Nice Easy Javascript:Web前端開發框架

    slider - 滑動條控件

    slider控件,此控件是util控件,需要指定滑動節點,滑動軌道節點和位置變化觸發事件就能實現滑動條的功能。控件不提供樣式,需要額外編寫。

  • Nice Easy Javascript:Web前端開發框架

    suggest - 建議提示控件

    用戶在input控件里輸入字符,把字符拼接成完整的郵箱地址,方便用戶快速選擇輸入,此控件是ui控件,已經生成了相關的html結構,只要傳相關的clazz樣式,對clazz下的樣式進行調整就可以應用自己的樣式需求

  • Nice Easy Javascript:Web前端開發框架

    template - 模版控件

    NEJ 模板系統功能強大,提供了7大模板,包含基本模板(Text模板、Node、Item模板、JST模板)和擴展模板(CSS模板、JS模板、HTML模 板)。基本模板提供了通用的結構模板功能,擴展模板提供了延遲加載各種客戶端資源(CSS、JS、HTML)的功能。Text、Node模板只提供了基本 的緩存功能,開發人員一般也不會直接使用。在使用結構模板的時候一般會選用JST模板或者Item模板。

  • Nice Easy Javascript:Web前端開發框架

    window - 窗體控件

    網頁上都會跳出一個對話窗體讓用戶進行確認,輸入交互等,這時用window控件是最完美的,可在以allocate    窗體時加一個遮罩,使用戶不能點擊窗體以外的東西窗體制作步驟是

  • Nice Easy Javascript:Web前端開發框架

    animation - 動畫控件

    這是一個動畫基類,動畫過程的邏輯需要從這個基類繼承過去重寫__doAnimationFrame的方法,這在個方法可以自己定義每一幀動羅的位置邏輯,庫里定義了貝塞爾曲線, 彈跳,減速,easein,easeinout,easeout,linear這些動畫方式

     
  • Nice Easy Javascript:Web前端開發框架

    cache - 緩存管理基類控件

    是util里緩存管理的基類,對外提供事件注冊,分發事件,提供從localStorage里存取,清除數據,從cache里存取刪除數據。

  • Nice Easy Javascript:Web前端開發框架

    customEvent - 自定義事件

    這 是個Util腳本,你可以以事件驅動的方式來書寫你的ui控件,對于簡單事件可以直接通過nej.p("nej.v") 來執行綁定,你也可以通過Util.$$CustomEvent.$allocate(opts)來在綁定自 定義事件前對此類型的自定義事件進行個性化定制來滿足更復雜的需求

  • Nice Easy Javascript:Web前端開發框架

    cycler - 循環播放控件

    根據傳入的圖片地址列表,圖片容器,圖片翻頁容器,有播頁時的回調事件,通過改變圖片的透明度來使圖片有淡入淡出的動畫效果,這里的動畫是和css3的動畫實現的,在低版本瀏覽器中不能應用這個動畫

項目主頁:http://www.baiduhome.net/lib/view/home/1353588214435

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!