码迷,mamicode.com
首页 > 其他好文 > 详细

[TypeStyle] Reusable styles using TypeStyle mixins

时间:2017-06-05 19:00:44      阅读:188      评论:0      收藏:0      [点我收藏+]

标签:size   color   mod   ntb   mixin   rip   creat   this   and   

TypeStyle’s style function allows you to give multiple objects as an argument. This provides a simple extensible reuse-ability model. We cover typestyle mixin and mixin creators in this lesson. We also demonstrate that you have the full power of JavaScript at your disposal when using TypeStyle.

 

import { style } from ‘typestyle‘;
import * as React from ‘react‘;
import * as ReactDOM from ‘react-dom‘;

const fontSize = (value: number | string) => {
    const valueStr = typeof value === ‘string‘ ?
                     value :
                     value + ‘px‘;
    return {
        fontSize: valueStr
    }
};
const className = style(
    fontSize(‘3em‘),
    {color: ‘red‘}
);

ReactDOM.render(
    <div className={className}>
        Hello Typestyle
    </div>,
    document.getElementById(‘root‘)
);

 

[TypeStyle] Reusable styles using TypeStyle mixins

标签:size   color   mod   ntb   mixin   rip   creat   this   and   

原文地址:http://www.cnblogs.com/Answer1215/p/6946408.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!