TypeScript bobril.createDerivedComponent函数代码示例

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

本文整理汇总了TypeScript中bobril.createDerivedComponent函数的典型用法代码示例。如果您正苦于以下问题：TypeScript createDerivedComponent函数的具体用法？TypeScript createDerivedComponent怎么用？TypeScript createDerivedComponent使用的例子？那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。

在下文中一共展示了createDerivedComponent函数的6个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: return

 return (c: f.ICursor<TState>) =>
     b.createDerivedComponent<TData>(
         b.createComponent<TData>({
             init(ctx: IDataComponentContext<TState, TData>) {
                 ctx.cursor = c;
                 ctx.state = f.getState(ctx.cursor);
             },
             render(ctx: IDataComponentContext<TState, TData>) {
                 ctx.state = f.getState(ctx.cursor);
             }
         }),
         component);

开发者ID:TuanTrong，项目名称:bobflux，代码行数:12，代码来源:dataComponent.ts

示例2: return

 return (c: f.ICursor<TState>) => (children?: b.IBobrilChildren) => b.createDerivedComponent(
     b.createComponent({
         init(ctx: IContext<TState>) {
             ctx.cursor = c;
             ctx.state = f.getState(ctx.cursor);
         },
         shouldChange(ctx: IContext<TState>, me: b.IBobrilNode, oldMe: b.IBobrilCacheNode): boolean {
             let previousState = ctx.state;
             ctx.state = f.getState(ctx.cursor);
             return ctx.forceShouldChange || ctx.state !== previousState;
         }
     }),
     component)(null, children);

开发者ID:TuanTrong，项目名称:bobflux，代码行数:13，代码来源:component.ts

示例3: return

 return (c: f.ICursor<TState>) =>
     b.createDerivedComponent<TData>(
         b.createComponent<TData>({
             init(ctx: IRouteComponentContext<TState, TData>) {
                 ctx.cursor = c;
                 ctx.state = f.getState(ctx.cursor);
                 ctx.lastData = ctx.data;
             },
             shouldChange(ctx: IRouteComponentContext<TState, TData>, me: b.IBobrilNode, oldMe: b.IBobrilCacheNode): boolean {
                 let previousState = ctx.state;
                 let previousData = ctx.lastData;
                 ctx.state = f.getState(ctx.cursor);
                 ctx.lastData = ctx.data;
                 return ctx.forceShouldChange || !(ctx.data === previousData && ctx.state === previousState);
             }
         }),
         component);

开发者ID:TuanTrong，项目名称:bobflux，代码行数:17，代码来源:routeComponent.ts

示例4: header

		me.children = [ b.styledDiv('', bobrilLogo), ' ', ctx.data.children ];
		b.style(me, { fontSize: ctx.data.fontSize });
	}
});

interface IWarnHeaderData extends IHeaderData {
	isWarning?: boolean;
}

interface IWarnHeaderCtx extends b.IBobrilCtx {
	data: IWarnHeaderData;
}

const warnStyle = b.styleDef({ background: "#ffc0c0" });

const warnHeader = b.createDerivedComponent<IWarnHeaderData>(header, {
	render(ctx: IWarnHeaderCtx, me: b.IBobrilNode) {
		b.style(me, ctx.data.isWarning && warnStyle);
	}
});

setInterval(1000, ()=> {
	b.invalidate();
});

b.init(() => [
    header({ fontSize: 20 }, t('Hello')),
	warnHeader({ fontSize: 25, isWarning: true }, 'World'),
	header({ fontSize: 15 }, t('Right now is {now, date, LLLL}', { now: b.now() }))
]);

开发者ID:pstovik，项目名称:bobril-build，代码行数:30，代码来源:app.ts

示例5: render

import * as b from 'bobril';
import * as tag from 'bobrilstrap-tag';

export interface IData extends tag.IData {
}

interface ICtx extends b.IBobrilCtx {
    data: IData;
}

export default b.createDerivedComponent<IData>(tag.default, {
    render(ctx: ICtx, me: b.IBobrilNode) {               
        me.className = (me.className || '') + ' row'; 
    }
});

开发者ID:pstovik，项目名称:bobril-build，代码行数:15，代码来源:index.ts

示例6: render

export const create = b.createDerivedComponent<IData>(m.Paper, {
    render(ctx: IContext, me: b.IBobrilNode) {
        const d = ctx.data;

        me.children = [
            b.styledDiv(
                [
                    d.leftChildren && b.styledDiv(
                        d.leftChildren.map((button) => {
                            return b.styledDiv(
                                button,
                                styles.button,
                            );
                        }),
                        styles.buttonsContainer
                    ),
                    d.rightChildren && b.styledDiv(
                        d.rightChildren.map((button) => {
                            return b.styledDiv(
                                button,
                                styles.rightButton,
                            );
                        }),
                        styles.rightButtonsContainer
                    )
                ],
                d.contentWidth && {
                    minWidth: 852,
                    maxWidth: d.contentWidth,
                    margin: 'auto'
                }
            )
        ];

        b.style(
            me,
            styles.appBar,
            {background: m.primary2Color()}
        );
    }
});

开发者ID:LongerP，项目名称:bobril.github.io，代码行数:41，代码来源:lib.ts

注：本文中的bobril.createDerivedComponent函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。