- 使用React框架运行在Android环境上近年来，前端开发领域迅速发展，各种框架和工具层出不穷。React框架作为其中的一员，以其优雅的设计和高效的性能，受到了广大开发者的青睐。在传统的Web开发中，React主要用于构建用户界面，但随着移动应用的兴起，我们也可以使用React框架来开发运行在Android环境上的应用程序。准备工作在开始使用React框架开发Android应用之前，我们需... 使用React框架运行在Android环境上近年来，前端开发领域迅速发展，各种框架和工具层出不穷。React框架作为其中的一员，以其优雅的设计和高效的性能，受到了广大开发者的青睐。在传统的Web开发中，React主要用于构建用户界面，但随着移动应用的兴起，我们也可以使用React框架来开发运行在Android环境上的应用程序。准备工作在开始使用React框架开发Android应用之前，我们需...
- 最近在学习React Native跨平台开发，从零开始如何开发第一个基础应用并打包发布： 1. 环境准备安装Node.js安装React Native CLI设置Android或iOS开发环境（取决于你想要支持的平台） 2. 创建新项目 使用React Native CLI创建一个新的项目： npx react-native init MyProject 3. 检查项目结构 新项目会包含... 最近在学习React Native跨平台开发，从零开始如何开发第一个基础应用并打包发布： 1. 环境准备安装Node.js安装React Native CLI设置Android或iOS开发环境（取决于你想要支持的平台） 2. 创建新项目 使用React Native CLI创建一个新的项目： npx react-native init MyProject 3. 检查项目结构 新项目会包含...
- useState和useContext深度解析React Hooks 彻底改变了React组件的状态管理和功能复用方式，使得函数组件也能拥有类组件的功能。 useState：函数组件的状态管理 简介：useState是React中最基础的Hook，它允许我们在函数组件中添加状态。useState是React提供的一个内置Hook，用于在函数组件中添加局部状态。它接受一个初始值作为参数，返回... useState和useContext深度解析React Hooks 彻底改变了React组件的状态管理和功能复用方式，使得函数组件也能拥有类组件的功能。 useState：函数组件的状态管理 简介：useState是React中最基础的Hook，它允许我们在函数组件中添加状态。useState是React提供的一个内置Hook，用于在函数组件中添加局部状态。它接受一个初始值作为参数，返回...
- 一、前言在开发前端项目的时候，经常会遇到这样一种开发场景：多个模板页中应用的组件或者页面布局非常相似，比如较为熟悉的el-dialog、el-tooltip和el-table等页面布局。这时候就会考虑：是把它们拆分成多个不同的组件呢？还是只使用一个组件，创建足够的属性来改变不同的情况。这些解决方案都不够完美。如果拆分成多个组件，就不得不冒着如果功能变动你要在多个文件中更新它的风险。另一方面... 一、前言在开发前端项目的时候，经常会遇到这样一种开发场景：多个模板页中应用的组件或者页面布局非常相似，比如较为熟悉的el-dialog、el-tooltip和el-table等页面布局。这时候就会考虑：是把它们拆分成多个不同的组件呢？还是只使用一个组件，创建足够的属性来改变不同的情况。这些解决方案都不够完美。如果拆分成多个组件，就不得不冒着如果功能变动你要在多个文件中更新它的风险。另一方面...
- 顺手就是一套 callback业务场景在最新一期的需求中，我需要在所有的购买入口，添加"阅读购买须知"的模块。"阅读购买须知"的模块主要包括两部分内容：购买须知按钮和提示文案。提交购买时，也需要增加对应的校验：是否已经进行了阅读操作。如果未操作，给出提示且不能进行下一步操作；如果已操作，可以继续下一步操作。UI 展示效果组件化设计按照代码复用的设计理念，我将"购买须知"模块进行了组件化设计。... 顺手就是一套 callback业务场景在最新一期的需求中，我需要在所有的购买入口，添加"阅读购买须知"的模块。"阅读购买须知"的模块主要包括两部分内容：购买须知按钮和提示文案。提交购买时，也需要增加对应的校验：是否已经进行了阅读操作。如果未操作，给出提示且不能进行下一步操作；如果已操作，可以继续下一步操作。UI 展示效果组件化设计按照代码复用的设计理念，我将"购买须知"模块进行了组件化设计。...
- 一、前言ReactNative组件分为类组件和函数组件。实现ReactNative自定义组件基本流程如下：组件需要实现什么效果;组件基本逻辑是怎样的；继承Component或PureComponent实现render()方法;定义组件属性字段及其类型，以及是否必须，如不必须则默认字段值是什么;绑定点击或者触摸等事件方法，执行前需要判空;注册、调用。 二、参数传递React Native版本... 一、前言ReactNative组件分为类组件和函数组件。实现ReactNative自定义组件基本流程如下：组件需要实现什么效果;组件基本逻辑是怎样的；继承Component或PureComponent实现render()方法;定义组件属性字段及其类型，以及是否必须，如不必须则默认字段值是什么;绑定点击或者触摸等事件方法，执行前需要判空;注册、调用。 二、参数传递React Native版本...
- 一、前言在开发react-native App时，相信大家都遇到过这样的问题：当用户设置了系统的字体大小之后，导致APP布局紊乱，甚至有些内容会被切掉/隐藏，这对于用户来讲，是非常不好的用户体验。那为什么会出现这种情况呢？原因是我们在开发的时候，布局的前提是系统的字体大小设置为默认大小，所以只能保证在系统字体大小正常的情况下，我们的布局是友好的，那么，我们应该如何解决这个问题呢？今天这篇文... 一、前言在开发react-native App时，相信大家都遇到过这样的问题：当用户设置了系统的字体大小之后，导致APP布局紊乱，甚至有些内容会被切掉/隐藏，这对于用户来讲，是非常不好的用户体验。那为什么会出现这种情况呢？原因是我们在开发的时候，布局的前提是系统的字体大小设置为默认大小，所以只能保证在系统字体大小正常的情况下，我们的布局是友好的，那么，我们应该如何解决这个问题呢？今天这篇文...
- 一、前言在做RN App开发过程中离不了用户交互，在React Native中没有专门的按钮组件。为了让视图能够响应用户的点击事件，需要借助Touchablexxx组件来包裹视图。为什么说是Touchablexxx呢，因为它不只是一个组件，而是一组组件，以下四个组件都可以用来包裹视图来响应用户的点击事件。TouchableWithoutFeedback：响应用户的点击事件，如果你想在处理点... 一、前言在做RN App开发过程中离不了用户交互，在React Native中没有专门的按钮组件。为了让视图能够响应用户的点击事件，需要借助Touchablexxx组件来包裹视图。为什么说是Touchablexxx呢，因为它不只是一个组件，而是一组组件，以下四个组件都可以用来包裹视图来响应用户的点击事件。TouchableWithoutFeedback：响应用户的点击事件，如果你想在处理点...
- 概述所谓生命周期，就是一个对象从开始生成到最后消亡所经历的状态，理解生命周期，是合理开发的关键。RN 组件的生命周期整理如下图：如图，可以把组件生命周期大致分为三个阶段：第一阶段：是组件第一次绘制阶段，如图中的上面虚线框内，在这里完成了组件的加载和初始化；第二阶段：是组件在运行和交互阶段，如图中左下角虚线框，这个阶段组件可以处理用户交互，或者接收事件更新界面；第三阶段：是组件卸载消亡的阶段... 概述所谓生命周期，就是一个对象从开始生成到最后消亡所经历的状态，理解生命周期，是合理开发的关键。RN 组件的生命周期整理如下图：如图，可以把组件生命周期大致分为三个阶段：第一阶段：是组件第一次绘制阶段，如图中的上面虚线框内，在这里完成了组件的加载和初始化；第二阶段：是组件在运行和交互阶段，如图中左下角虚线框，这个阶段组件可以处理用户交互，或者接收事件更新界面；第三阶段：是组件卸载消亡的阶段...
- 一、前言数据持久化一直都是软件开发中重要的一个环节，几乎所有的应用都具备这项功能；什么是数据持久化呢？说白了就是数据的本地化存储，将数据存储到本地，在需要的时候进行调用。本文介绍两种在 React-Native 中比较常用的存储方式：AsyncStorage及Realm。AsyncStorage：官方使用的存储方式，类似于 iOS 中的 NSUserDefault ，区别在于，AsyncS... 一、前言数据持久化一直都是软件开发中重要的一个环节，几乎所有的应用都具备这项功能；什么是数据持久化呢？说白了就是数据的本地化存储，将数据存储到本地，在需要的时候进行调用。本文介绍两种在 React-Native 中比较常用的存储方式：AsyncStorage及Realm。AsyncStorage：官方使用的存储方式，类似于 iOS 中的 NSUserDefault ，区别在于，AsyncS...
- 一、前言ReactNative启动完成之后，就会加载jsbundle中的js代码，进入js层渲染。此篇博文重点讲解 ReactNative JS 层渲染涉及的 diff 算法。使用 React 写过 Web 和 ReactNative的，很明显感觉到：除了组件命名不一样之外，生命周期、刷新机制等几乎是完全一样的，这也就是 Facebook 所说的“learn once, write any... 一、前言ReactNative启动完成之后，就会加载jsbundle中的js代码，进入js层渲染。此篇博文重点讲解 ReactNative JS 层渲染涉及的 diff 算法。使用 React 写过 Web 和 ReactNative的，很明显感觉到：除了组件命名不一样之外，生命周期、刷新机制等几乎是完全一样的，这也就是 Facebook 所说的“learn once, write any...
- 一、前言先带大家分析2张架构图，对RN大致的运行加载过程有个印象。ReactNative系统框架图如下所示:启动流程图如下所示：在开始分析之前，先思考一个问题：为什么ReactNative能像web端一样实现跨端和热更新，同时又有接近Native的性能呢？ReactNative 的本质是在 JS 端编写 React 代码，通过 JavaScriptCore 引擎，把 JS 端编写的组件和事... 一、前言先带大家分析2张架构图，对RN大致的运行加载过程有个印象。ReactNative系统框架图如下所示:启动流程图如下所示：在开始分析之前，先思考一个问题：为什么ReactNative能像web端一样实现跨端和热更新，同时又有接近Native的性能呢？ReactNative 的本质是在 JS 端编写 React 代码，通过 JavaScriptCore 引擎，把 JS 端编写的组件和事...
- react-vite-admin-arco： 基于react18+arco-design+zustand4+bizcharts+axios等技术实现轻量级后台前端解决方案。支持dark+light主题模式、i18n国际化语言、动态权限校验、3种布局模板、tab路由标签栏等功能。 react-vite-admin-arco： 基于react18+arco-design+zustand4+bizcharts+axios等技术实现轻量级后台前端解决方案。支持dark+light主题模式、i18n国际化语言、动态权限校验、3种布局模板、tab路由标签栏等功能。
- 一、前言在开发前端项目的时候，经常会遇到这样一种开发场景：多个模板页中应用的组件或者页面布局非常相似，比如较为熟悉的el-dialog、el-tooltip和el-table等页面布局。这时候就会考虑：是把它们拆分成多个不同的组件呢？还是只使用一个组件，创建足够的属性来改变不同的情况。这些解决方案都不够完美。如果拆分成多个组件，就不得不冒着如果功能变动你要在多个文件中更新它的风险。另一方面... 一、前言在开发前端项目的时候，经常会遇到这样一种开发场景：多个模板页中应用的组件或者页面布局非常相似，比如较为熟悉的el-dialog、el-tooltip和el-table等页面布局。这时候就会考虑：是把它们拆分成多个不同的组件呢？还是只使用一个组件，创建足够的属性来改变不同的情况。这些解决方案都不够完美。如果拆分成多个组件，就不得不冒着如果功能变动你要在多个文件中更新它的风险。另一方面...
- 在 React 中实现文件分片上传和下载，我们可以借助一些第三方库和工具来简化开发。实现文件分片上传和下载的功能。这种方式可以提高大文件传输的效率和稳定性，并且支持断点续传的功能。 在 React 中实现文件分片上传和下载，我们可以借助一些第三方库和工具来简化开发。实现文件分片上传和下载的功能。这种方式可以提高大文件传输的效率和稳定性，并且支持断点续传的功能。
上滑加载中
推荐直播
-
物联网资深专家带你轻松构建AIoT智能场景应用2024/11/21 周四 16:30-18:00
管老师 华为云IoT DTSE技术布道师
如何轻松构建AIoT智能场景应用？本期直播将聚焦华为云设备接入平台，结合AI、鸿蒙（OpenHarmony）、大数据等技术，实现物联网端云协同创新场景，教您如何打造更有实用性及创新性的AIoT行业标杆应用。
回顾中 -
Ascend C算子编程之旅：基础入门篇2024/11/22 周五 16:00-17:30
莫老师 昇腾CANN专家
介绍Ascend C算子基本概念、异构计算架构CANN和Ascend C基本概述，以及Ascend C快速入门，夯实Ascend C算子编程基础
即将直播 -
深入解析：华为全栈AI解决方案与云智能开放能力2024/11/22 周五 18:20-20:20
Alex 华为云学堂技术讲师
本期直播我们将重点为大家介绍华为全栈全场景AI解决方案以和华为云企业智能AI开放能力。旨在帮助开发者深入理解华为AI解决方案，并能够更加熟练地运用这些技术。通过洞悉华为解决方案，了解人工智能完整生态链条的构造。
去报名
热门标签