React 数据驱动 JavaScript 框架 Relay

BSD
JavaScript
跨平台
Facebook
2015-09-16
叶秀兰
温馨提示:该项目除了使用 BSD 协议授权外,还需遵守附加的专利授权

Relay 是构建数据驱动 React 应用的 JavaScript 框架。

主要特性:

  • 声明式:不再使用一个命令式 API 与数据存储通讯。简单的使用 GraphQL 声明你的数据需求,让 Relay 理解如何,什么时候获取你的数据。

  • 托管:查询在视图后面,Relay 聚合查询成有效的网络请求,只获取你需要的数据。

  • 转变:Relay 允许你使用 GraphQL mutations 在客户端和服务器端转变数据,提供自动数据一致,优化更新和错误处理。

简单列表:

class Tea extends React.Component {
  render() {
    var {name, steepingTime} = this.props.tea;
    return (
      <li key={name}>
        {name} (<em>{steepingTime} min</em>)
      </li>
    );
  }
}
Tea = Relay.createContainer(Tea, {
  fragments: {
    tea: () => Relay.QL`
      fragment on Tea {
        name,
        steepingTime,
      }
    `,
  },
});
class TeaStore extends React.Component {
  render() {
    return <ul>
      {this.props.store.teas.map(
        tea => <Tea tea={tea} />
      )}
    </ul>;
  }
}
TeaStore = Relay.createContainer(TeaStore, {
  fragments: {
    store: () => Relay.QL`
      fragment on Store {
        teas { ${Tea.getFragment('tea')} },
      }
    `,
  },
});
class TeaHomeRoute extends Relay.Route {
  static routeName = 'Home';
  static queries = {
    store: (Component) => Relay.QL`
      query TeaStoreQuery {
        store { ${Component.getFragment('store')} },
      }
    `,
  };
}
ReactDOM.render(
  <Relay.RootContainer
    Component={TeaStore}
    route={new TeaHomeRoute()}
  />,
  mountNode
);


的码云指数为
超过 的项目
加载中

评论(0)

暂无评论

Relay 1.3.0 发布,React 的数据驱动框架

Relay 是构建数据驱动 React 应用的 JavaScript 框架,它简化了开发复杂的用户界面的过程,为应用提供了一种声明式的,面向组件的提取数据的方法。声明式的数据提取的意思就是,Relay 应用可...

2017/08/30 07:39

Relay 1.0.0 发布,React 的数据驱动框架

Relay 是构建数据驱动 React 应用的 JavaScript 框架,它简化了开发复杂的用户界面的过程,为应用提供了一种声明式的,面向组件的提取数据的方法。声明式的数据提取的意思就是,Relay 应用可...

2017/05/22 07:28

没有更多内容

加载失败,请刷新页面

没有更多内容

暂无问答

MySql 5.6关于replicate secure加强

Slave SQL: If a crash happens this configuration does not guarantee that the relay log info will be consistent, Error_code: 0...

2016/02/14 16:15
47
1
Cisco 帧中继 分析和实验

Cisco 帧中继 实验 配置 命令

2015/03/08 14:53
137
0
用Relay Shield控制LED灯开关

用Relay Shield控制LED灯开关: 代码如下: #include const char relayPin[4] = {4,5,6,7}; void setup() { int i; for(i = 0; i < 4; i++) { pinMode(relayPin[i],OUTPUT); } }...

2013/07/02 19:45
271
0
MHA工作原理

MHA工作原理: 主库挂了,但是主库的binlog都被全部从库接收 此时会选中应用binlog最全的一台从库作为新的主库,其他从主只需要重新指定一下主库即可(因为此时,所有从库都是一致的,所以只需...

2014/09/15 17:18
8.6K
0
开源的数据库连接池 SQL Relay 介绍

概述: SQL Relay是个功能强大并且非常容易使用的持久数据库连接池系统,能够运行在Unix/Linux系统下,能够支持大部分主流的数据库系统和大部分的编程语言,有效的减轻服务器的负载和移植问题...

2014/06/29 22:52
46
0
MYSQL 主从 同步问题解决方案

今天在测试MYSQL主从的过程中,从 Master 的 phpMyAdmin 中删除了几条数据,然后再运行的时候,发现 Slave 不能同步 故障现象: 进入slave服务器,运行: mysql> show slave status\G ........

2012/09/22 09:54
50
0
记录一次postfix无法收取邮件和mysql异常不能启动

maillog 全是如下错误 ``` 2016-10-11 06:01:04 postfix/smtpd[9006]: NOQUEUE: reject: MAIL from unknown[115.28.224.6]: 452 4.3.1 Insufficient system storage; proto=ESMTP helo= 2016...

2016/10/11 13:41
26
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部