点这里

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. Nunit单元测试的使用

    先建立一个需要测试的项目 安装nunit 通过nuget安装Install-Package Nunit  类前加[TestFixture] 要测试的方法前加[Test] using System; u ...

  2. 深入浅出const

    §通常,如果一个对象通过引用方式传到函数f中,而函数f又不会通过修改对象的数据成员的值改变该对象的状态,那么,我们最好将f的参数标记为const,这样可以预防对参数的误写,同时有些编译器还可对这种情况 ...

  3. JVM规范小结

    JVM规范组成: 1. 字节码(ByteCode): 以Class或Interface为基本单位, 具有固定结构. 2. 指令集(InstructionSet): 每个指令用一个字节表示, 最多256 ...

  4. Go语言类型switch

    switch还可以用于判断变量类型.使用方式为T.(type),即在变量后加上.(type).见代码: package main import ( "fmt" ) func mai ...

  5. Python-memcached的基本使用

    想学Python,又想研究下memcached的客户端,于是拿Python-memcached研究研究~~~ 1.memcached的安装 请参考本博另一文章<Linux下安装memcached ...

  6. php xml转为xml或者json

    <?php class XmlToArray { private $xml; private $contentAsName="content" ; private $attr ...

  7. vs2013中把解决方案上传到SVN服务器

    在VS2013中直接上传代码到SVN服务器,在这之前,必须是你的电脑已经安装了TortoiseSVN. 其次,VS2013必须安装AnkhSVN插件.然后才可以向我下面所述一样使用TortoiseSV ...

  8. 一个Option请求引发的深度解析

    在当前项目中,前端通过POST方式访问后端的REST接口时,发现两条请求记录,一条请求的Request Method为Options,另一条请求的Reuest Method为Post.想要解决这个疑惑 ...

  9. 嵌入字体@font-face

    嵌入字体@font-face @font-face能够加载服务器端的字体文件,让浏览器端可以显示用户电脑里没有安装的字体. 语法: @font-face { font-family : 字体名称; s ...

  10. 向Array中添加冒泡排序

    冒泡排序思想 通过在无序区的相邻元素的比较和替换,使较小的元素浮到最上面. 冒泡排序实现 Function.prototype.method = function(name, func){ this. ...