Brix — UX

采用 KISSY 加载方式 new Pagelet

KISSY.use('brix/core/pagelet', function(S, Pagelet) {
    var pagelet = new Pagelet({
        container: '#container1',
        tmpl: S.one('#tmpl_helloword2').html(),
        data: data
    });

    // Pagelet 实例化完后，需要给 Pagelet 中组件附加行为，
    // addBehavior 会层次化的加载所有 pagelet 中用钩子（bx-name）标识的组件。
    pagelet.addBehavior();

所有组件加载完成后，会调用ready注册的方法

pagelet.ready(function () {
    //将模板和数据渲染到页面
    pagelet.render();
});

拿到helloworld组件，对其进行对应的属性、方法、事件的调用

var helloworld = pagelet.getBrick('helloworld1');

完整的代码

KISSY.use('brix/core/pagelet', function(S, Pagelet) {
    var data = {
        name:'ZuoMo'
    };
    var pagelet = new Pagelet({
        container: '#container1',
        tmpl: S.one('#tmpl_helloword2').html(),
        data: data
    });
    pagelet.addBehavior();
    pagelet.ready(function () {
        pagelet.render();
        //拿到helloworld组件的实例
        var helloworld = pagelet.getBrick('helloworld1');
    });
});

完整的 demo：

总结