文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

「首席架构师推荐」React生态系统大集合

React设置流程 React钩子 React钩子 用React Hooks和Context替换Redux React Hooks备忘单：解锁常见问题的解决方案 如何使用React Hooks获取数据？...日历组件 react-datepicker - ReactJS Datepicker react-list - 一个多功能的无限卷轴React组件 react-intl - 国际化React应用程序...如何弓数据！ PrimeReact - React最完整的UI框架！...- 在React中生成复杂，经过验证和扩展的基于JSON的表单 Redux-Autoform - 从元数据中动态创建Redux-Forms uniforms - 一堆React组件和帮助器，可以轻松生成和验证表单...- React组件包装器，用于将React与MobX结合使用 MobX教程 10分钟介绍MobX和React 使用MobX管理React应用程序中的复杂状态 将您的应用程序从Redux重构为MobX

12.3K30
您找到你想要的搜索结果了吗？
是的
没有找到

React Native+React Navigation+Redux开发实用教程

为了帮助大家快速上手在React Native与Redux开发，在这本文中将向大家介绍如何在React Native中使用Redux?，以及一些必备基础以及高级知识。...本参考了《新版React Native+Redux打造高质量上线App》课程的部分讲解，更多关于React Native与Redux的实战技巧可在《新版React Native+Redux打造高质量上线...那么如何在React Native中使用Redux和react-navigation组合?呢？...经过上述4步呢，我们已经完成了react-navigaton+redux的集成，那么如何使用它呢？...； 如何动态的设置store，和动态获取store(难点：storekey不固定)； 如何实现可取消的redux action：可参考SearchPage的设计； 上述的实战技巧可在新版React Native

3.9K10

干货 | 携程机票 React Native 整洁架构实践

前言 携程机票前台团队在使用 React Native 实现众多业务的过程中，经历了前期少量探索，中期大量应用，后期架构和性能优化的三个阶段。...React Native 是 React 和 Native 的混合体，原有的 Native 框架 API 被映射成 React Component 生命周期，编程语言也发生了变化，不变的是业务场景和逻辑复杂度...模块组成，最外层模块处理页面路由和页面初始化数据，低价日历、列表展示和筛选作为子模块嵌套其中。...在完成从 Native 迁移 React Native 技术栈之后，后续如果需要移植到小程序或 Flutter 如何成本最低？...六、总结 App 客户端技术栈从原生快速迁移到 React Native 之类的混合技术方案, 平台 API 变了，编程语言变了，但不变的是业务复杂性。

1.8K30

一份传男也传女的 React Native 学习笔记

一、开始学习 React Native React Native 社区相对比较成熟，中文站的内容也比较全面，从入门到进阶，环境安装到使用指南，学习 React Native 推荐从官网 https://...与原生混编的情况下，React Native 与原生如何通信传送门 在 IDE 选择这一点上，不要过多纠结，个人使用 WebStorm ，比较省心。...二、助力 React Native 起飞 以下内容不建议在第一个 Demo 中使用： 2.1 Redux Redux(中文教程、英文教程) 是 JavaScript 状态容器，提供可预测化的状态管理。...部分推荐教程： [阮一峰] - Redux 入门教程（一）：基本用法 [阮一峰] - Redux 入门教程（二）：中间件与异步操作 [阮一峰] - React-Redux 的用法 2.2 CodePush...优点：React Native 和原生组合使用，通过动态路由动态在原生页面和 React Native 页面之间切换，可以在原生页面出现 bug 的时候切换至 React Native 页面，或者比较简单的页面直接使用

2K20

如何在已有的 Web 应用中使用 ReactJS

从 jQuery 到 React 我最近的任务是用 React 重构一个使用 jQuery 写的功能。这个过程困难重重，因为大量的 jQuery 分散在代码段中。...所以，如果你的代码是用 jQuery 或者其它框架所写，那么应该如何使用 React 去替换这些 UI 片段？...比如，从页面其它位置的日期下拉框中更新日历。 菜单和日历在不同的容器中，但是它们的状态是共享的。 我将用 jQuery 和 ReactJS 做的 4 个例子解释共享/独立状态的概念。...使用类似 Redux 的工具在全局定义状态和 actions，然后将组件挂载上去。 使用 Container 分享状态 这是使用  React 渲染比较常见的方式，尤其 SPA 应用或者 UI 片段。...主要的解决方法就是，如果你使用 jQuery 处理 UI 片段，那么你可以将容器元素替换成一个 React 组件。如果你需要在多个组件中分享状态，那么你可以使用容器方法或者类似 Redux 的库。

14.5K00

如何在现有的 Web 应用中使用 ReactJS

从 jQuery 到 React 我最近的任务是用 React 重构一个使用 jQuery 写的功能。这个过程困难重重，因为大量的 jQuery 分散在代码段中。...所以，如果你的代码是用 jQuery 或者其它框架所写，那么应该如何使用 React 去替换这些 UI 片段？...比如，从页面其它位置的日期下拉框中更新日历。 菜单和日历在不同的容器中，但是它们的状态是共享的。 我将用 jQuery 和 ReactJS 做的 4 个例子解释共享/独立状态的概念。...使用类似 Redux 的工具在全局定义状态和 actions，然后将组件挂载上去。 使用 Container 分享状态 这是使用  React 渲染比较常见的方式，尤其 SPA 应用或者 UI 片段。...主要的解决方法就是，如果你使用 jQuery 处理 UI 片段，那么你可以将容器元素替换成一个 React 组件。如果你需要在多个组件中分享状态，那么你可以使用容器方法或者类似 Redux 的库。

7.7K40

翻译 | Thingking in Redux（如果你只了解MVC）

经过一番讨论，我们最终做出的决定是：React-Native。学习一门新的“语言”或者框架并不是个大问题，但是老兄我得告诉你，React-Native和Redux确确实实是块难啃的骨头。...这篇文章没有介绍React-Native是如何工作的（因为那确实不是最难的部分）。...下面几段文字的目的在于帮助任何人完成从“Thingking in MVC”到“Thinking in Redux”的转换。希望能对你有所帮助。 React-Natvie 和 Redux？...从MVC思想转换至Redux思想 MVC和Redux之间一个主要的不同点就是：MVC中的数据能够双向流动，但在Redux中，数据被限制为只能单向流动。 经典MVC。那时的人生还没有如此艰难。...虽然你仍然需要做一些基础的的模版设置填充，但是我希望这解释清楚了如何以redux的方式进行思考。 有些问题曾经让我掉到坑里一段时间（比如：信息传到了哪？

1.3K100

跨端移动应用开发解决方案 | ARES小程序转换工具1.0 正式发布

那么，React Native是怎样的呢？React Native使用的是JSX来组织UI，由于JSX本质上是JS，所以React很自由动态，它就是代码，最终运行时会给你结果。...从“静态”到“动态”相对简单，之前我们发布过一个工具： http://npm.m.jd.com/package/@jdreact/to-jdreact-engine，就是把小程序的代码转化为React...那么如何把“动态”的React Native代码转化为“静态”的小程序代码呢？ AST操纵代码 先解决一个前置问题：我们必须能够理解代码语义进而能够“操纵代码”。...那么当我们遇到这样的React Native代码时 ? 可以通过AST修改代码，变成index.wxml ? React运行时 回到我们一开始提出的“动态”与“静态”的问题。...那么如何转化这种情况，让其在小程序上同样正常呢，也就是之前的问题：如何把相对“动态”的React Native代码转化为小程序代码呢？

2.6K20

从项目中由浅入深的学习react (2)

序列文章 从项目中由浅入深的学习vue,微信小程序和快应用(1) 前言 从pc(dva+umi)和mobile(原生react)两个项目来介绍react的使用 搞懂这两个项目,上手撸react代码so-easy...提供render方法 react-router 4.x组成 react-router(核心路由和函数) , react-router-dom(API) , react-router-native( React...Native 应用使用的API) react-router 4.x的API router(只能有一个) , route(匹配路由渲染UI) , history, link(跳转) , navlink(...代码分割,相当于vue-router中的路由懒加载 classNames 动态css的类 2.react-pc-template篇 2.1效果图 react-pc-template项目, 欢迎star...2.3技术栈 dva+umi+ant-design-pro dva:可拔插的react应用框架,基于react和redux mui:集成react的router和redux ant-design-pro

1.4K40

“别更新了，学不动了” 之：全栈开发者 2019 应该学些什么？

随着新的 Context API 的问世和 GraphQL + Apollo 的普及，React 今年则遭遇了一点危机。很长一段时间以来，Redux 第一次被认为不是状态管理的明智选择。...你仍然需要学习 Redux，因为你可以从 Redux 中学到一些有用的计算机科学原理，如事件溯源和 CQRS。...但如果从就业方面来看，学习 Redux 仍然是一个很好的选择。 服务器端渲染 服务器端渲染在 JavaScript 领域仍然是一个待解决的问题。...（静态页面），通过利用服务器的 API 在客户端成为动态单页面应用程序。...iOS 和 Android 仍然是企业所需要的重要开发技能，但在过去几年中对它们的需求一直在下降，似乎出现了从原生移动开发到 React Native 引领的混合开发（或接近原生）的重大转变。

2.5K30

React路由基本用法

所以 RR4 只是一堆 提供了导航功能的组件（还有若干对象和方法），具有声明式（声明式编程简单来讲就是你只需要关心做什么，而无需关心如何去做，可组合性的特点。...绑定的 React Router react-router-native 用于 React Native 的 React Router react-router-redux React Router...和 Redux 的集成 react-router-config 静态路由配置的小助手 2.react-router-dom怎样使用？...的基本用法： react-router-dom的API在网上能搜索到一大堆，这里不啰嗦了；直接上怎么用？...组件：主要用于导航拥有激活状态准备的；它和Link的路由匹配效果一致；不同的是NavLink有状态标记，Link无状态标记，如下面效果实现就建议使用NavLink； NavLink用法如下

1.5K30

必须要会的 50 个React 面试题（下）

高阶组件是重用组件逻辑的高级方法，是一种源于 React 的组件模式。 HOC 是自定义组件，在它之内包含另一个组件。它们可以接受子组件提供的任何动态，但不会修改或复制其输入组件中的任何行为。...数据如何通过 Redux 流动？ ? Data Flow in Redux 41. 如何在 Redux 中定义 Action？...React 路由有一个简单的API。 47. 为什么React Router v4中使用 switch 关键字 ？...列出 React Router 的优点。 几个优点是： 就像 React 基于组件一样，在 React Router v4 中，API 是 'All About Components'。...包是分开的：共有三个包，分别用于 Web、Native 和 Core。这使我们应用更加紧凑。基于类似的编码风格很容易进行切换。 50. React Router与常规路由有何不同？

3.5K21

2021年50个酷炫的Web和移动项目创意

所涉及的技术栈是： 前端：HTML，CSS，JavaScript，TypeScript，React，React Native，Redux，Flutter / Dart 后端：Python，Node.Js...编程级别：中级 项目类型：全栈 前端：HTML，CSS，TypeScript，React，React Native 后端：Node.Js，NoSQL 4.求职应用 如何创建一个看起来更像约会应用的求职应用...您可以开发一个应用程序，使您可以标记发现迷路动物的位置。...编程级别：中级 项目类型：全栈 前端：HTML，CSS，JavaScript，React，Redux，React本机 后端：Node.Js，NoSQL 32.随机用户名生成器API 想出一个很酷的用户名可能会很累...编程级别：高级 项目类型：全栈 前端：HTML，CSS，JavaScript，React，Redux，React Native 后端：Python，SQL 39.乐高建设者社交网络 它可能是一个社交网络

3.8K20

干货 | 携程度假无线前端架构演进之路

这从 React-IMVC 的框架命名中，可以看出来。...React-IMVC 适用于做 PC/H5 的同构前端应用，但对 App/React-Native 和小程序的支持不足。如何节省多端开发成本，成了一个需要严肃考量的议题。...虽然我们可以抽取成 custom hooks，使之可以复用到 React-Native，但当我们在 useEffect 里使用 DOM/BOM 或 RN 特有 API 去触发 setState 时，它们又跟特定平台耦合...Model 是单独定义的，通过暴露的 React-Hooks API，在 React-DOM 组件里使用，同时它也可以在 React-Native 组件中使用。...以上，我们粗略地描述了我们的前端架构设计如何从 Backbone.js 走到 Pure-Model + Monorepo + GraphQL-BFF + React-Native/React-IMVC

2.1K30

干货 | 如何一步步打造基于React的移动端SPA框架

我们这里提供了各种表单组件，列表展示组件，预加载组件，日历组件，广告组件等。 Hybrid Shell/Bridge 这层属于独有的，根据Native提供的方法写的。...如果要像Native一样的体验，H5真的很难处理，H5无法控制，我们需要React Native。那这里只讨论“加载慢”这个痛点。 我们把Hybrid的“加载慢”问题拆分为下面3个点。 1....静态直出带来一个问题是如何实时更新？我们Native端做了一套更新机制，可以根据API的数据实行打开APP就更新静态文件。...这其实是在项目前期，我们心里对Redux还是有所抵触，思维要从原来的操作DOM到操作React这种状态操作，同时对从React直接操作状态到通过action去更改组件状态，的确需要时间消化。...提到的目的是让大家在实现自己的移动业务框架考虑一下自己的应用场景是否真的需要Redux。 8、我们如何实现工程化，自动化 最后我们来我们在做这个SPA框架时如何实现的工程化。 1.

1.7K100

技术创新，基于 React Native 的开源项目 | 码云周刊第 17 期

我们将介绍以下主题： TensorFlow 的工作原理 什么是机器学习模型 什么是神经网络 神经网络如何学习 如何操作数据并将其传递给神经网络 如何运行模型并获得预测结果 码云推荐 1、使用 React...Native 重写 Git@OSC 客户端 react-native-gitosc ?...) 3、基于 React Native 的通讯录 App React-Native-App ?...项目简介：Poplar 是一个 React Native 实现的移动内容社区App，Spring框架实现其后台服务，提供Restful API访问，MySQL、Redis作为持久存储和数据缓冲。...项目简介：使用 react-native + redux 信息管理工具，您可以将加密信息保存到 OneDrive，并从 OneDrive 还原。目前只支持 Android。

1.5K80
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券