0.0.9 • Published 9 years ago

brix-loader v0.0.9

Weekly downloads
86
License
MIT
Repository
github
Last release
9 years ago

Brix Loader

Build Status Coverage Status Dependency Status

组件加载器，负责管理组件的整个生命周期，包括加载、初始化、渲染、销毁。

安装 Install

$ bower install --save brix-loader

用法 Usage

// 配置 Loader 路径
require.config({
    paths: {
        'brix/loader': 'bower_components/brix-loader/dist/loader'
    }
})
// 加载 Loader
require(['brix/loader'], function(Loader){
    // 加载组件
    Loader.boot('body', function(){
        // 查找组件
        var instances = Loader.query('components/dropdown')
        instance.toggle()
    })
})

方法 Methods

共计 5 个公开方法：

  1. Loader.boot( context, complete, notify )
  2. Loader.destroy( component, complete )
  3. Loader.query( moduleId, context )
  4. Loader.load( element, moduleId, options, complete )
  5. Loader.unload( element, complete )

Loader.boot( context , notify( error, instance, index, count ) )

初始化节点 context 以及节点 context 内的所有组件。当所有组件初始化完成后回调函数 complete 被执行，当每个组件初始化完成后回调函数 notify 被执行。

  • Loader.boot( complete, notify )
    • Loader.boot()
    • Loader.boot( complete )
    • Loader.boot( complete, notify )
  • Loader.boot( element, complete, notify )
    • Loader.boot( element )
    • Loader.boot( element, complete )
    • Loader.boot( element, complete, notify )
  • Loader.boot( array{element}, complete, notify )
    • Loader.boot( array )
    • Loader.boot( array, complete )
    • Loader.boot( array, complete, notify )

参数的含义和默认值如下：

  • context 可选。一个 DOM 元素，或一组 DOM 元素。默认为 document.body。

  • complete( records ) 可选。一个回调函数，当所有组件初始化完成后被执行。

    • records 二维数组，记录了组件在初始化过程中的相关信息，包括：异常 error、组件实例 instance、在初始化队列中的下标 index、初始化队列的长度 count。数据结构为：

      [
    [error, instance, index, count],
    [error, instance, index, count],
    ...
]

      详见下一个参数 notify。

  • notify( error, instance, index, count ) 可选。一个回调函数，当每个组件初始化完成后被执行。

    • error 初始化过程中可能抛出的 Error 对象。如果没有发生任何错误，则为 undefined。
    • instance 当前组件的实例。
    • index 当前组件在初始化队列中的下标，即初始化的顺序。
    • count 初始化队列的长度。

Loader.destroy( component , complete() )

销毁某个组件，包括它的后代组件。

  • Loader.destroy( component, complete )
    • Loader.destroy( component )
    • Loader.destroy( component, complete )
  • Loader.destroy( element, complete )
    • Loader.destroy( element )
    • Loader.destroy( element, complete )
  • Loader.destroy( array{element|component}, complete )
    • Loader.destroy( array )
    • Loader.destroy( array, complete )
  • Loader.destroy( context, complete )
    • Loader.destroy( context )
    • Loader.destroy( context, complete )

参数的含义和默认值如下：

  • component 某个组件实例。
  • element 一个关联了某个组件的 DOM 元素。
  • array{element|component} 一个含有组件实例或 DOM 元素的数组。
  • context 一个 DOM 元素。
  • complete() 可选。一个回调函数，当组件销毁后被执行。

Loader.destroy( moduleId , context )

  • Loader.destroy( moduleId, complete )
    • Loader.destroy( moduleId )
    • Loader.destroy( moduleId, complete )
  • Loader.destroy( moduleId, context, complete )
    • Loader.destroy( moduleId, context )
      • Loader.destroy( moduleId, parentModuleId )
      • Loader.destroy( moduleId, parentComponent )
      • Loader.destroy( moduleId, parentElement )
      • Loader.destroy( moduleId, array{parentModuleId} )
      • Loader.destroy( moduleId, array{parentComponent} )
      • Loader.destroy( moduleId, array{parentElement} )
    • Loader.destroy( moduleId, context, complete )

参数的含义和默认值如下：

  • moduleId 模块标识符。
  • context 限定销毁的范围。可以是父（祖先）模块标识符 parentModuleId、父（祖先）组件实例 parentComponent、父（祖先）节点 parentElement 或数组 array{parentModuleId|parentComponent|parentElement}。
  • complete() 可选。一个回调函数，当组件销毁后被执行。

Loader.query( moduleId , context )

根据模块标识符 moduleId 查找组件实例。

  • Loader.query( moduleId, context )
    • Loader.query( moduleId )
    • Loader.query( moduleId, parentModuleId )
    • Loader.query( moduleId, parentComponent )
    • Loader.query( moduleId, parentElement )
    • Loader.query( moduleId, array{parentModuleId} )
    • Loader.query( moduleId, array{parentComponent} )
    • Loader.query( moduleId, array{parentElement} )
  • Loader.query( element )
    • Loader.query( element )
    • Loader.query( array{element} )

参数的含义和默认值如下：

  • moduleId 模块标识符。
  • context 限定查找的范围。可以是父（祖先）模块标识符 parentModuleId、父（祖先）组件实例 parentComponent、父（祖先）节点 parentElement 或数组 array{parentModuleId|parentComponent|parentElement}。
  • element 设置了属性 bx-name 的节点或节点数组。

该方法的返回值是一个数组，包含了一组 Brix 组件实例，并且，数组上含有所有 Brix 组件实例的方法。

Loader.load( element, moduleId , options )

加载组件 moduleId 到指定的节点 element 中。

  • Loader.load( element, moduleId, options, complete )
    • Loader.load( element, moduleId )
    • Loader.load( element, moduleId, options )
    • Loader.load( element, moduleId, complete )
    • Loader.load( element, moduleId, options, complete )
  • Loader.load( array{element}, moduleId, options, complete )
    • Loader.load( array{element}, moduleId)
    • Loader.load( array{element}, moduleId, options)
    • Loader.load( array{element}, moduleId, options, complete)

参数的含义和默认值如下：

  • moduleId 必选。模块标识符。
  • element 必选。目标节点。
  • array 必选。目标节点数组。
  • complete( records ) 可选。一个回调函数，当组件加载完成后被执行。
      • records 二维数组，记录了组件在初始化过程中的相关信息，包括：异常、实例、在初始化队列中的下标、初始化队列的长度。

因为每个组件的行为不可以预测（例如，table 是增强，dropdwon 是替换，pagination 是插入），导致销毁和再次加载的行为也不可预测，所以不能直接在节点 element 上加载，而是在其内新建一个容器元素 <div>，在这个容器元素上加载组件 moduleId。

Loader.unload( element , complete )

卸载节点 element 中加载的组件。

  • Loader.unload( element, complete )
    • Loader.unload( element )
    • Loader.unload( element, complete )
  • Loader.unload( array{element}, complete )
    • Loader.unload( array{element} )
    • Loader.unload( array{element}, complete )

参数的含义和默认值如下：

  • element 必选。目标节点。
  • array 必选。目标节点数组。
  • complete 可选。一个回调函数，当组件卸载完成后被执行。

文件结构 Structure

brew install tree
tree . -I 'node_modules|bower_components'

贡献者 Contributors

brew install git-extras
git summary

许可 License

MIT

@infinitebrahmanuniverse/nolb-bri@everything-registry/sub-chunk-1264brix-spa
0.0.9

9 years ago