构建用户界面的 JavaScript 库 ReactJS

构建用户界面的 JavaScript 库 ReactJS

MIT
JavaScript 查看源码»
跨平台
Facebook
2013-05-30
红薯

React(有时叫React.js或ReactJS)是 Facebook 推出的一个为数据提供渲染为 HTML 视图,用来构建用户界面的开源 JavaScript 库。

React 视图通常采用包含以自定义 HTML 标记规定的其他组件的组件渲染。React 为程序员提供了一种子组件不能直接影响外层组件("data flows down")的模型,数据改变时对 HTML 文档的有效更新,和现代单页应用中组件之间干净的分离。

特性:

声明式

  • React 可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时 React 也可以高效地更新渲染界面。以声明式编写 UI,可以让你的代码更加可靠,且方便调试。

组件化

  • 创建好拥有各自状态的组件,再由组件构成更加复杂的界面。无需再用模版代码,通过使用 JavaScript 编写的组件你可以更好地传递数据,将应用状态和 DOM 拆分开来。

一次学习,随处编写

  • 无论你现在正在使用什么技术栈,你都可以随时引入 React 开发新特性。React 也可以用作开发原生应用的框架 React Native。

示例代码:

一个简单的组件

class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Hello {this.props.name}
      </div>
    );
  }
}
ReactDOM.render(
  <HelloMessage name="John" />,
  mountNode
);

输出:Hello John

加载中

评论(13)

h
heshanfu
推荐一个不错React js UI / UX库的精选列表:React.js Examples
w
wolf_haung
感觉又有点回到cs的年代
FutureElement
FutureElement
不太喜欢jsx语法 #ReactJS#
FutureElement
FutureElement
不太喜欢jsx语法 #ReactJS#
曾建凯
曾建凯
手贱用重新用 #ReactJS# 写了个table view,发不发博客呢?
曾建凯
曾建凯
国内很少见大规模应用ReactJS的案例,我发一个基于 #ReactJS##Semantic-UI# 的案例吧:http://erp-demo.yhzp.co/ ,测试账号/密码:zjk/123123。目前业务逻辑调整中,所以这个版本可以作为一个预览版本。(前一条动弹因为一些原因删除了)
MartinBockZhu
MartinBockZhu
mark #ReactJS#
曾建凯
曾建凯
#ReactJS# 对于前端解耦、HTML代码重用,的确有很大建树——不过基于一个前提,是你做了足够充分的封装。
曾建凯
曾建凯
发起一个项目#ReactJS# + #Semantic-UI#,第二个CSS框架作为可替换为任意的CSS框架,如#Bootstrap#等。近期会先发布一个先期preview。有木有感兴趣的同学?
vidy_tu
vidy_tu
一直很好奇这种标签式的语法是怎么写在Js里面,才发现FB用js做了一套语法分析 #ReactJS#

React 16.6.3 发布,构建用户界面的 JavaScript 库

React 16.6.3 发布了,此版本更新如下: React DOM 修复 Suspense 和 lazy 中的 bug。 (@acdlite in #14133, #14157, and #14164) 修复 React DevTools 中 React.memo 更新的高亮显示。(@bva...

11/14 06:57

React v16.6.0 发布,新增 lazy, memo 和 contextType 等便捷特性

React 开发团队于2018年10月24日在官方博客宣布了 React 16.6.0。开发团队表示,该版本新增了不少便利的特性,下面我们不妨去了解一下吧! 按照官方的说法,React.memo() 主要是用于函数式组...

10/25 08:11

React Fire:React DOM 的改造计划,使其更现代化

React 开发者,同时也是 Redux 和 Create React App 作者之一的 Dan Abramov gaearon 昨日在 React 的 GitHub 仓库提了一个这样的 issue —— React Fire: Modernizing React DOM(React Fir...

09/02 04:16

React v16.4.2 发布,构建用户界面的 JavaScript 库

React v16.4.2 已发布,本次更新主要是对 React DOM 服务器进行 bug 修复: Fix a potential XSS vulnerability when the attacker controls an attribute name (CVE-2018-6341). This fix i...

08/02 07:59

观察 Stack Overflow 趋势的新姿势: 看标签的综合浏览量

获取 Stack Overflow 上的季度页面浏览量并不容易,在这篇文章中,我们将向你介绍这些数据的意义所在,以及获取这些数据的过程。 TensorFlow 真的比 Git 更受关注吗? 根据 Stack Overflow 的...

07/14 07:58

勿以 star 数论高低!React 在前端框架世界仍是领先地位

上周在前端的 JavaScript 框架世界发生了一件称得上是“里程碑”的事:Vue.js 在 GitHub 上的 star 数量终于超过了 React.js 的 star 数量。 通过使用一个叫做 Star History 的工具,我们可以...

06/21 08:14

React 16.4.1 发布,构建用户界面的 JavaScript 库

React 16.4.1 已发布,主要更新内容如下: React 现在可以将 propType 分配给由 React.ForwardRef 返回的组件。(@bvaughn in #12911) React DOM 修复:当输入类型从其他类型更改为文本时崩溃...

06/14 07:43

React 16.4.0 发布,构建用户界面的 JavaScript 库

React 16.4.0 已发布,该版本包含许多改进和修复,部分如下: React:新增一个试验性的用于测量性能的 React.unstable_Profiler 组件; React DOM:支持 Pointer Events 规范; React DOM:正...

05/25 07:25

没有更多内容

加载失败,请刷新页面

27
回答
准备组建3-5人的前端团队,技术选型react和vue,应该选哪个呢

个人后端出身,准备组建3-5人的前端团队,技术选型react和vue,应该选哪个呢,请有经验的建议。

06/20 18:52
27
回答
高手问答第 210 期 —— 前端开源狂热专家带你深入 React 技术
博文视点 的回答 09/11 17:44
最佳答案
高手问答第 210 期 —— 前端开源狂热专家带你深入 React 技术 @fattypanda @NotFound403 @varHarrie @Andrew1985 @vr和ar加油努力 恭喜以上五位网友或获得《React状态管理与同构实战》图书一本 请私信 @博文视点 告知快递信息(格式...
34
回答
高手问答第 195 期 — 前端框架的后起之秀:React 进阶之路
局长 的回答 05/08 10:35
最佳答案
高手问答第 195 期 — 前端框架的后起之秀:React 进阶之路 @idisikx @cnc2007 @陈雄 @brucewang41 @李大胆 恭喜以上五位用户获得《React进阶之路》图书一本 请尽快私信@局长 告知快递信息(格式:姓名+电话+地址),感谢支持~
2
回答
react 项目怎么部署到服务器

我npm run build 后 把dist文件放到服务器 没办法访问

2017/02/27 17:47
2
回答
怎么运行别人写好的reactjs项目
boystudio 的回答 2017/05/27 19:04
最佳答案
1. 首先安装nodejs最新稳定版,配置环境变量,使得node和npm命令能正常运行,自己去官方下载; 2. 在项目下运行 npm install 安装依赖 3. 然后看项目下的README.md,一般有指引教你如何运行。 若没有指引,那就看项目下的package.json,里面会有一些说明...
29
回答
OSC 第 134 期高手问答 — React 全栈整合开发

OSCHINA 本期高手问答(2016 年 11 月 21 日 — 11 月27 日)我们请来了@vikingmute 张轩和@nighca 杨寒星为大家...

2016/11/21 14:46
3
回答
2016年度——React.js 最佳实践

最近React(web/native)依旧如火如荼,相信大家都跃跃欲shi,我们团队也开始在React领域有所尝shi. 2016年应该是 React 逐...

2016/03/24 11:48
2
回答
结合 ES6+ 开发 React 组件

这是 Steven Luscher 写的一篇关于 React 的文章,Steven Luscher 擅长使用 React 和 GraphQL 构建应用。 ...

2015/07/09 17:12
6
回答
如果只让你推荐一款web前端框架/ui的话,你会推荐哪个呢?

ReactJS ionic semantic-ui Amaze UI 现在我们要做手机web版,和app里面的webview页在,如果只让你推荐一款web...

2015/09/24 15:51
2
回答
如何在一个react模块组件里引入嵌套另一个react模块组件

用webpack打包,如何在一个组件里引入嵌套另一个react模块组件,每一个react组件单独写成一个jsx文件,想要进行嵌套,如果直接用import ...

2016/07/13 15:06

没有更多内容

加载失败,请刷新页面

react native 0.56.0

0.56.0 更新日志 能力有限,如有问题,请包涵(哈哈)原文请点击 欢迎 React Native 2018年6月份正式版的发布,超过53位捐献者提供797次提交,非常感谢你们每一位。 在您阅读本文的此刻,这个...

07/17 14:39
61
0
React Native for Android 官方文档中文版(最新)全国首发

Facebook 于 2015 年 9 月 15 日发布了 React Native for Android, 把 Web 和原生平台的 JavaScript 开发技术扩展到了 Google 的流行移动平台--Android。极客学院 Wiki 团队(http://wiki.ji...

2015/09/18 14:26
204
1
可代替Dropbox

React的开源许可证 React最初的开源许可证为Facebook 在BSD许可证基础上附加了专利防御保护条款,即BSD+Patents license。 解读 原许可证在著作权授权使用(BSD)的基础上添加了防御性专利侵...

08/22 11:19
2
0
ReactJS基础视频教程

React是什么? React.js 是 Facebook 推出的一个用来构建用户界面的 JavaScript 库。 Facebook开源了React,这是该公司用于构建反应式图形界面的JavaScript库,已经应用于构建Instagram网站及...

2016/04/17 16:38
233
1
Got JS Exception: ReferenceError: Can't find varia

在Android Studio上首次运行(react-native)AwesomeProject(导入android即可),出现了一下问题 Got JS Exception: ReferenceError: Can't find variable: __fbBatchedBridge 01-27 03:24...

2016/01/27 17:02
519
1
React Native 学习资料

React Native常见错误与示例:https://toutiao.io/subjects/84686 React学习: https://toutiao.io/subjects/1145 浪客书心学react全栈:https://toutiao.io/subjects/132403 江清清的技术专栏...

2016/11/22 18:05
9
0
Reactjs 辅助工具小结

classnames https://github.com/JedWatson/classnames 主要是为了辅助在组件上面设置是否存在class <li> className={classNames({ "xxx" : true, "ddd" : false })...

2016/06/07 11:31
37
0
React入门第三弹—— 一切从React开始

译注: 这是今年5月份React Native刚发布的时候,在code.facebook.com发布的一篇博客。时隔5个月,这篇文章依然值得一读,尤其是对于想了解为何 Facebook要开发并发布React Native的新手、对于...

2016/01/16 10:55
136
1
Facebook 再次重磅投下几个开源库

1. Android 图片缓存 - Fresco GitHub:https://github.com/facebook/fresco 特点: 两个内存缓存加上磁盘缓存构成了三级缓存 支持流式,可以类似网页上模糊渐进式显示图片 对多帧动画图片支...

2016/03/28 17:29
8
1

没有更多内容

加载失败,请刷新页面

返回顶部
顶部