点这里

React Style 是 React.js 可维护的样式组件。使用 React Native StyleSheet.create一样的样式。

完全使用 JavaScript 定义样式:

1
2
3
4
5
6
7
var StyleSheet = require('react-style')
var styles = StyleSheet.create({
    foo: {
      color: 'red',
      backgroundColor: 'white'
    }
})

样式 React 组件:

1
2
3
4
5
6
7
8
9
10
var React = require('react')
 
class HelloWorld extends React.Component{
 
  render() {
    var dynamicStyles = {color: this.props.color}
    return <div styles={[styles.foo, dynamicStyles]}>Hello, world!</div>
  }
 
}

https://github.com/js-next/react-style

React.js 样式组件:React Style的更多相关文章

  1. react.js table组件【可以直接使用】

    最近在做一个CMS,使用的技术是刚刚学习的react.js,准备制作一个查询的页面以及一个新增的页面. 这是table的公共组件: 我们在使用的过程中,只会用到: 制作出来的查询页面: 新增页面: 上 ...

  2. React Js之组件(Component)与state

    React Js组件: 组件(Component)是为了更好的维护我们的应用,可以在不影响其他的组件的情况下更新或者更改组件. state:是标记数据的来源,我们使state比较简单和单一,如果我们有 ...

  3. react.js父子组件通信

    这里通过todolist的功能来说明 父组件: import React,{ Component,Fragment } from 'react'; import TodoItem from './To ...

  4. react.js 父子组件数据绑定实时通讯

    import React,{Component} from 'react' import ReactDOM from 'react-dom' class ChildCounter extends Co ...

  5. React.js 小书 Lesson23 - dangerouslySetHTML 和 style 属性

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson23 转载请注明出处,保留原文链接和作者信息. 这一节我们来补充两个之前没有提到的属性,但是在 ...

  6. 移动web端的react.js组件化方案

     背景: 随着互联网世界的兴起,web前端开发的方式越来越多,出现了很多种场景开发的前端架构体系,也对前端的要求日益增高,早已经不是靠一个JQuery.js来做前端页面的时代了,而今移动端变化最大,近 ...

  7. React.js 小书 Lesson24 - PropTypes 和组件参数验证

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson24 转载请注明出处,保留原文链接和作者信息. 我们来了到了一个非常尴尬的章节,很多初学的朋友 ...

  8. React.js 小书 Lesson18 - 挂载阶段的组件生命周期(一)

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson18 转载请注明出处,保留原文链接和作者信息. 我们在讲解 JSX 的章节中提到,下面的代码: ...

  9. React.js - 入门

    React.js - 第1天 1. React简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 ...

随机推荐

  1. Environment 类

    提供有关当前环境和平台的信息以及操作它们的方法. 此类不能被继承. using System; using System.Collections; using System.Collections.G ...

  2. hdu 4324 Triangle LOVE

    题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=4324 Triangle LOVE Description Recently, scientists f ...

  3. iOS 数据库持久化

    Java代码 -(void) addObserver{ //当程序进入后台时执行操作 UIApplication *app = [UIApplication sharedApplication]; [ ...

  4. Entity Framework学习笔记(一)

    请注明转载地址:http://www.cnblogs.com/arhat 哈哈!老魏回来了,4月份的内容开始更新了,由于3月份时间都在做项目,没有时间写了,那么4月份老魏会尽可能的多写点东西的.那么4 ...

  5. Json.Net使用JSON Schema验证JSON格式【实例】

    给出一个Json,验证其格式是否符合规则. { "coord": { //对象 "lon": 145.77, "lat": -16.92 } ...

  6. C++编程显示四则运算题目

    题目:C++编程显示四则运算题目 设计思路:(1)让用户自己确定出题的数量,同时显示加减乘除四则运算. (2)考虑到用户可能只会一种运算,因此可以选择运算.

  7. fstab文件

    格式: 文件系统 挂载点 格式 挂载文件系统选项 备份选项 自检选项 1.指定挂载的设备或者远程文件系统,比如普通的挂载设备/dev/sda1, 对于nfs格式:<host>:<di ...

  8. 安装Windows7出现:”安装程序无法创建新的系统分区 也无法定位系统分区“ 终极解决方案

    参考:地址 解决方法: 1.先格式化一下你要装的那个盘,然后,拔出U盘,啥也别动,只拔出U盘就行,再装上U盘,然后刷新一下[选硬盘那里的高级选项中有格式化和刷新],再选择要安装的硬盘点下一步,OK了, ...

  9. ThinkDev.Logging-Queue模块介绍

    Queue,ThinkDev.Logging对内存级队列的封装. 主要针对需要简单进程内内存级队列提供支持,应用无需关心存储及线程. 配置例子: <!-- 队列对象 --> <Que ...

  10. netty 粘包问题处理

    netty 粘包问题处理 key words: netty 粘包 解包 半包 TCP 一般TCP粘包/拆包解决办法 定长消息,例如每个报文长度固定,不够补空格 使用回车换行符分割,在包尾加上分割符,例 ...