当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript classnames类代码示例

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


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

示例1: data

 data().map((row, rowIndex) => {
     return m(
         'tr',
         {
             class: classnames(
                 selectedRow() === rowIndex &&
                     'row-selected'
             ),
         },
         row.map((value, index) => {
             return m(
                 'td',
                 {
                     class:
                         'col-' +
                         rowIndex +
                         '-' +
                         index,
                     style:
                         'width: ' +
                         columnWidth(index) +
                         'px',
                     tabindex: 0,
                     onkeydown: onCellKeydown,
                     onfocus: () => {
                         selectedRow(rowIndex)
                         selectedCol(index)
                     },
                 },
                 valueToString(value)
             )
         })
     )
 })
开发者ID:jakobrun,项目名称:gandalf,代码行数:34,代码来源:result.ts

示例2: classNames

  return state$.map( ({props, checked} ) => {

    const className = classNames('radioButton', style[props.disabled ? 'disabled' : 'field'],
      props.className);
    const inputClassName = classNames('radioInput', style.input);

    //TODO: split input into a new function
    return (
      div([
        label( { props: { className }, attrs: { 'data-cycle-ui': 'radio-button' } }, [
          input( { props: {
            className: inputClassName,
            //TODO: which version?
            // attributes: {
            //   readonly: props.readonly,
            // },
            readonly: props.readonly,
            type: 'radio'
          },
          attrs: {
          }}),
          Radio(sources, {
            checked: checked,
            disabled: props.disabled,
          }).DOM,
          props.label && label([
            span( { props: { className: style.text } },
              props.label
            ),
          ]),
        ]),
      ])
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:34,代码来源:RadioButton.ts

示例3: classNames

export const validationClassName = (validation: IValidationProps) => {
  validation = validation || {};
  return classNames({
    'ng-dirty': !!validation.touched,
    'ng-invalid': validation.validationStatus === 'error',
    'ng-warning': validation.validationStatus === 'warning',
  });
};
开发者ID:emjburns,项目名称:deck,代码行数:8,代码来源:utils.ts

示例4: classNames

  const vtree$ = props$.map( (props) => {

    const className = classNames(style[props.checked ? 'radio-checked' : 'radio'], props.className);

    return (
      div( { props: { className }, attrs: { 'data-cycle-ui': 'radio' } } )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:8,代码来源:Radio.ts

示例5: classNames

  const vtree$ = props$.map( (props) => {

    const className = classNames(style.cardActions, props.className);

    return (
      div( { props: { className } },
        children
      )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:10,代码来源:CardActions.ts

示例6: classNames

  const vtree$ = props$.map( (props) => {

    const className = classNames(style.cardText, props.className);
    console.log(children);
    return (
      div( { props: { className } },
        typeof children === 'string' ? p(children) : children
      )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:10,代码来源:CardText.ts

示例7: render

 render() {
     // as a style tag (using webpack's css-loader)
     const tpl = `<div style="${styles.toString()}"></div>`;
     // or as scoped unique classes, also latest typescript versions allow prop access using dot like styles.darkUI instead of styles['darkUI']
     return `
         <div class="${classNames((this.theme === 'dark') ?
             styles.darkUI :
             styles.lightUI.toString())}">
         </div>
     `;
 }
开发者ID:AlexGalays,项目名称:DefinitelyTyped,代码行数:11,代码来源:css-modules-tests.ts

示例8: classNames

  const vtree$ = props$.map( (props) => {

    //TODO: do Avatars at some point

    //let avatarComponent;

    // if (typeof avatar === 'string') {
    //   avatarComponent = <Avatar image={avatar} />;
    // } else {
    //   avatarComponent = avatar;
    // }

    const className = classNames(style.cardTitle, {
      // [style.small]: props.avatar,
      // [style.large]: !props.avatar
    }, props.className);
    const titleDOM = props.title &&
      h5(`.${style.title}`, props.title);

    const childrenAsStringDOM = children && typeof children === 'string' &&
      h5(`.${style.title}`,
        children
      );

    const subtitleDOM = props.subtitle &&
      p(`.${style.subtitle}`, props.subtitle);

    const childrenAsArray = children && typeof children !== 'string' &&
      children;

    return (
      div( { props: { className } }, [
        div(concat([],
          titleDOM,
          childrenAsStringDOM,
          subtitleDOM,
          childrenAsArray
        )),
      ]
      // [
      //   //TODO: Avatars
      //   // {avatarComponent && (
      //   //   <div className={style.avatar}>
      //   //     {avatarComponent}
      //   //   </div>
      //   // )}
      // ]
      )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:50,代码来源:CardTitle.ts

示例9: classNames

  const vtree$ = props$.map( (props) => {

    const className = classNames(style.card, {
      [style.raised]: props.raised
    }, props.className);

    return (
      div({
          props: { className },
          attrs: { 'data-cycle-ui': 'card' }
        },
        children
      )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:15,代码来源:Card.ts

示例10: classNames

  const vtree$ = props$.map( (props) => {

    const $radioGroupSelectedValue = Observable.combineLatest(childrenValues, (...values) => {
      return { itemMouseClick$ };
    }).startWith(props.value)
      .do(x => console.log('radioGroupSelectedValue ' + x));

    const className = classNames('radioGroup', props.className);

    return (
      div( { props: { className }, attrs: { 'data-cycle-ui': 'radio-group' } },
        childrenDOMs
      )
    );
  });
开发者ID:eldarlabs,项目名称:cycle-ui,代码行数:15,代码来源:RadioGroup.ts


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