- 1、创建一个用react写的页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>hello_react</title> </head> <body> <!-- 准备好一个“容器” --> <div id="test"></div> <!-- 引入reac... 1、创建一个用react写的页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>hello_react</title> </head> <body> <!-- 准备好一个“容器” --> <div id="test"></div> <!-- 引入reac...
- 长话短说WebSocket 允许您的应用程序具有“实时”功能,其中更新是即时的,因为它们是在开放的双向通道上传递的。这与 CRUD 应用程序不同,CRUD 应用程序通常使用 HTTP 请求,必须建立连接、发送请求、接收响应,然后关闭连接。要在 React 应用程序中使用 WebSockets,您需要一个专用服务器,例如带有 NodeJS 的 ExpressJS 应用程序,以维持持久连接。不幸... 长话短说WebSocket 允许您的应用程序具有“实时”功能,其中更新是即时的,因为它们是在开放的双向通道上传递的。这与 CRUD 应用程序不同,CRUD 应用程序通常使用 HTTP 请求,必须建立连接、发送请求、接收响应,然后关闭连接。要在 React 应用程序中使用 WebSockets,您需要一个专用服务器,例如带有 NodeJS 的 ExpressJS 应用程序,以维持持久连接。不幸...
- 一、前言在React或React-native的点击事件中,会经常用到bind(this)。比如说一个简单的React-native点击组件:export default class AwesomeProject extends Component { constructor(props){ super(props); this.state = { } } hand... 一、前言在React或React-native的点击事件中,会经常用到bind(this)。比如说一个简单的React-native点击组件:export default class AwesomeProject extends Component { constructor(props){ super(props); this.state = { } } hand...
- 一、简介第三方组件库react-native-tab-navigator是用于在场景之间切换的选项卡栏,用JS编写以提供跨平台支持。它适用于iOS和Android。该组件与React Native 0.16和更高版本兼容。外观与本地导航器略有不同,但在某些方面会更好。也是纯JavaScript。注:这是与TabNavigation不一样的,使用了ExNavigation,API和实现方式略... 一、简介第三方组件库react-native-tab-navigator是用于在场景之间切换的选项卡栏,用JS编写以提供跨平台支持。它适用于iOS和Android。该组件与React Native 0.16和更高版本兼容。外观与本地导航器略有不同,但在某些方面会更好。也是纯JavaScript。注:这是与TabNavigation不一样的,使用了ExNavigation,API和实现方式略...
- 一、普通写法原来在组件中connect连接redux的写法是:import { connect } from 'react-redux';import { start, stop, reset } from './actions';class Home extends Component { ... // dispatch一个action this.props.d... 一、普通写法原来在组件中connect连接redux的写法是:import { connect } from 'react-redux';import { start, stop, reset } from './actions';class Home extends Component { ... // dispatch一个action this.props.d...
- 一、前言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 端编写的组件和事...
- 一、前言在项目开发过程中,有时候苦恼于eslint的校验规则,例如变量、方法定义时空格等的校验。主要有两种方式可实现关闭eslint提醒。 二、第一种方式在react-scripts依赖包下的config目录找到webpack.config.js配置文件,在webpack.config.js中注释掉以下代码:{ test: /\.(js|mjs|jsx|ts|tsx)$/... 一、前言在项目开发过程中,有时候苦恼于eslint的校验规则,例如变量、方法定义时空格等的校验。主要有两种方式可实现关闭eslint提醒。 二、第一种方式在react-scripts依赖包下的config目录找到webpack.config.js配置文件,在webpack.config.js中注释掉以下代码:{ test: /\.(js|mjs|jsx|ts|tsx)$/...
- Unpoly 是一个轻量级的 JavaScript 框架,它允许您通过 HTML over the wire 的方式进行 Web 应用程序开发。HTML over the wire 是一种网络通信模式,它将由服务器生成的 HTML 片段作为响应发送给客户端,而不是传统的 JSON 数据。这样,服务器端可以处理更多逻辑,而客户端可以专注于渲染和展示内容。Unpoly 旨在让开发人员能够轻松构建... Unpoly 是一个轻量级的 JavaScript 框架,它允许您通过 HTML over the wire 的方式进行 Web 应用程序开发。HTML over the wire 是一种网络通信模式,它将由服务器生成的 HTML 片段作为响应发送给客户端,而不是传统的 JSON 数据。这样,服务器端可以处理更多逻辑,而客户端可以专注于渲染和展示内容。Unpoly 旨在让开发人员能够轻松构建...
- JavaScript 框架是预先编写的 JavaScript 代码集合,为开发 Web 应用程序提供结构化且可重用的基础。这些框架都有自己独特的功能、方法和生态系统。1.React.js描述React.js,通常称为 React,是一个用于构建用户界面的声明性和基于组件的 JavaScript 库。它由 Facebook 开发,由于其高效、简单和可重用性而被广泛采用。React 允许开发人员... JavaScript 框架是预先编写的 JavaScript 代码集合,为开发 Web 应用程序提供结构化且可重用的基础。这些框架都有自己独特的功能、方法和生态系统。1.React.js描述React.js,通常称为 React,是一个用于构建用户界面的声明性和基于组件的 JavaScript 库。它由 Facebook 开发,由于其高效、简单和可重用性而被广泛采用。React 允许开发人员...
- 在移动应用开发领域,跨平台框架提供了一种快速开发高性能应用程序的方式。两个备受关注的跨平台框架是React Native和Flutter。本文将比较这两个框架的特点、优势和劣势,以帮助开发者选择适合自己项目需求的技术栈。一、React Native的特点和优势:React Native是由Facebook开发的一个基于React的开源框架,可用于构建原生iOS和Android应用。以下是Re... 在移动应用开发领域,跨平台框架提供了一种快速开发高性能应用程序的方式。两个备受关注的跨平台框架是React Native和Flutter。本文将比较这两个框架的特点、优势和劣势,以帮助开发者选择适合自己项目需求的技术栈。一、React Native的特点和优势:React Native是由Facebook开发的一个基于React的开源框架,可用于构建原生iOS和Android应用。以下是Re...
- React作为一种流行的前端框架,提供了一种高效的方式来构建交互式用户界面。然而,在构建大型应用程序时,管理组件之间的状态变得至关重要。这就引出了React状态管理的问题。在本文中,我们将比较Redux、MobX和Context API这三种常见的React状态管理解决方案。Redux: Redux是最早出现的React状态管理库之一。它的核心思想是将应用程序的状态存储在单个全局状态树中,通... React作为一种流行的前端框架,提供了一种高效的方式来构建交互式用户界面。然而,在构建大型应用程序时,管理组件之间的状态变得至关重要。这就引出了React状态管理的问题。在本文中,我们将比较Redux、MobX和Context API这三种常见的React状态管理解决方案。Redux: Redux是最早出现的React状态管理库之一。它的核心思想是将应用程序的状态存储在单个全局状态树中,通...
- 移动应用开发领域的竞争日益激烈,开发人员需要在短时间内构建高质量的应用程序,并且能够在多个平台上运行。在这样的环境下,跨平台移动应用开发框架变得越来越受欢迎。本文将重点比较两个主要的跨平台开发框架:React Native和Xamarin。React Native是由Facebook开发的开源框架,它允许开发人员使用JavaScript和React构建原生移动应用程序。React Nativ... 移动应用开发领域的竞争日益激烈,开发人员需要在短时间内构建高质量的应用程序,并且能够在多个平台上运行。在这样的环境下,跨平台移动应用开发框架变得越来越受欢迎。本文将重点比较两个主要的跨平台开发框架:React Native和Xamarin。React Native是由Facebook开发的开源框架,它允许开发人员使用JavaScript和React构建原生移动应用程序。React Nativ...
- 在现代的前端开发中,选择一个合适的框架对于构建高性能和可维护的应用程序至关重要。目前,Angular、React和Vue.js是最受欢迎的前端框架之一。本文将对这三个框架的性能进行评估和对比,以帮助开发者做出更明智的选择。加载时间和初始渲染: 在首次加载和初始渲染方面,Vue.js表现出色。其轻量级的框架大小以及高效的虚拟DOM算法使得Vue.js能够快速加载和渲染页面。React也具备高效... 在现代的前端开发中,选择一个合适的框架对于构建高性能和可维护的应用程序至关重要。目前,Angular、React和Vue.js是最受欢迎的前端框架之一。本文将对这三个框架的性能进行评估和对比,以帮助开发者做出更明智的选择。加载时间和初始渲染: 在首次加载和初始渲染方面,Vue.js表现出色。其轻量级的框架大小以及高效的虚拟DOM算法使得Vue.js能够快速加载和渲染页面。React也具备高效...
- React 是一种流行的 JavaScript 库,用于构建动态用户界面。最近,它与 TypeScript 的结合变得越来越流行。由于 TypeScript 的静态类型检查和更好的 IDE 支持,它使得使用 React 更加容易和可维护。当开发 React 应用程序时,我们通常需要使用 CSS 样式来渲染组件。本文将介绍如何在使用 React TypeScript 时,将 CSS 样式作为道... React 是一种流行的 JavaScript 库,用于构建动态用户界面。最近,它与 TypeScript 的结合变得越来越流行。由于 TypeScript 的静态类型检查和更好的 IDE 支持,它使得使用 React 更加容易和可维护。当开发 React 应用程序时,我们通常需要使用 CSS 样式来渲染组件。本文将介绍如何在使用 React TypeScript 时,将 CSS 样式作为道...
上滑加载中
推荐直播
-
OpenHarmony应用开发之网络数据请求与数据解析
2025/01/16 周四 19:00-20:30
华为开发者布道师、南京师范大学泰州学院副教授,硕士研究生导师,开放原子教育银牌认证讲师
科技浪潮中,鸿蒙生态强势崛起,OpenHarmony开启智能终端无限可能。当下,其原生应用开发适配潜力巨大,终端设备已广泛融入生活各场景,从家居到办公、穿戴至车载。 现在,机会敲门!我们的直播聚焦OpenHarmony关键的网络数据请求与解析,抛开晦涩理论,用真实案例带你掌握数据访问接口,轻松应对复杂网络请求、精准解析Json与Xml数据。参与直播,为开发鸿蒙App夯实基础,抢占科技新高地,别错过!
回顾中 -
Ascend C高层API设计原理与实现系列
2025/01/17 周五 15:30-17:00
Ascend C 技术专家
以LayerNorm算子开发为例,讲解开箱即用的Ascend C高层API
回顾中
热门标签