前言vue写的不少了,想了解一下react,再加上大家都说typescript很香,所以用react + typescript写个小的demo项目了解一下。因为项目主要为了练一下各种技术的配合使用,所以结构和代码上实现的比较随意,有兴趣的学习react的新人朋友们也就酌情浏览就好了?,我也是正在学习react,大家可以留言讨论哈。项目地址https://github.com/18sby/disor
    react项目构建可以很简单,但是如果是结合typescript,其实也不是很麻烦,官网也有很明确的说明。有两种办法:    1、直接构建带有typescriptreact项目,我们需要增加额外的参数,模版不能使用默认的cra-template。而是使用cra-template-typescript。npx create-react-app tsr
转载 2023-10-14 02:51:54
176阅读
react项目中使用typescriptreact项目中使用typescript安装`typescript``package.json``scripts`出现配置 TypeScript 编译器例如设置使用TS的文件目录以及TS的输出目录文件扩展名类型定义 react项目中使用typescript安装typescript npm install --save-dev typescriptpack
转载 2023-09-04 14:13:52
151阅读
react router @4 和 vue路由本文大纲:1、vue路由基础和使用2、react-router @4用法3、什么是包容性路由?什么是排他性路由?4、react路由有两个重要的属性:children和render的区别?5、react如何在路由里面定义一个子路由?6、vue如何在路由里面定义一个子路由?7、react怎么通过路由传参?8、vue怎么通过路由传参?9、怎么在react里拿
转载 6月前
25阅读
前言在上一篇提升开发体验,我们一下子集成了一堆插件和功能进去,导致项目结构比教混乱,重点问题就在webpack的相关配置项目录build文件夹,所以今天的工作较为轻松,重点就是进行项目结构整理,然后再进行一些杂项的添加。整理项目结构集成Ant Design并进行主题修改整合常用函数,并且让所有组件继承这些函数集成mobx进行项目的状态管理使用react-hot-loader进行热加载集成svg
转载 2024-07-17 23:03:41
29阅读
1. ReactRouter基础1.1. react-router安装1.2. react-router的使用1.2.1. BrowserRouter/HashRouter1.2.2. Route1.2.2.1. exact1.2.3. Switch1.2.4. Link1.2.5. NavLink2. 路由配置2.1. 安装 react-router-dom2.2. 安装 react-route
前言前段时间学习了ReactTypescript,所以两个一起用试试; 有点遗憾的是Redux还没学,后续学了Redux后才算完整。。。没办法,三分钟热度的我还在学flutter啊。。。说一下调接口的问题,最近包括上一份工作都遇到过,后端接口收不到参数。。。搞半天,结果是因为他们是从URL获取的请求参数,无论请求方式是否GET,,,所以沟通还是很重要的,如果后端大佬接口测试通过(postman/
转载 2024-07-10 01:27:03
43阅读
在开发基于 ReactTypeScript 的应用时,配置 IP 地址路径是一个常见需求。这篇博文将详细介绍如何在项目中进行这样配置,确保在不同环境下应用能够顺利运行。 ## 环境准备 在开始之前,我们需要确保开发环境的搭建完备。以下是我们需要安装的前置依赖: | 依赖项 | 版本 | 兼容性
原创 6月前
65阅读
欢迎关注前端早茶,与广东靓仔携手共同进阶 前端早茶专注前端,一起结伴同行,紧跟业界发展步伐~ 一、前言 在R
原创 2022-11-14 17:08:32
484阅读
# 如何实现"React TypeScript" ## 简介 React是一个流行的JavaScript库,用于构建用户界面。TypeScript是一种静态类型的JavaScript超集,它可以让我们在开发过程更加安全和高效。结合ReactTypeScript可以提供更好的开发体验和更可靠的代码。本文将指导你如何使用ReactTypeScript搭建一个应用程序。 ## 整体流程 下面是
原创 2023-12-02 13:20:41
44阅读
TypeScript with React
转载 2020-08-23 17:40:00
150阅读
前言公司的项目用到了React Native,最近通过后台监控到一些崩溃问题,主要出在React Native Java侧的源码,由于无法在js侧去定位和修复问题,于是希望通过修改React Native源码达到规避Crash的目的,下面记录编译React Native源码的过程。注:本文所有流程仅在macOS下测试通过,未在Linux和Windows下测试准备工作下载RN源码首先需要准备一份R
转载 2024-01-05 21:06:06
81阅读
一,新建项目npx react-native init ximalaya --template react-native-template-typescript二,多环境配置在android和ios的开发,无法使用proscess.env.NODE_ENV的方式区分环境,需要使用一个包来实现: react-native-config 官网地址:https://js.coach/package/r
转载 2023-09-18 16:10:11
317阅读
使用--typescript参数新建React项目 create-react-app react-ts-demo --template typescript新建Header.tsx文件,加入以下代码:import React, { FC } from 'react';interface MyProps { Name: string, ID: number } export con
@TypeScript 常用方法简述Record定义一个简单的map ,由key-value组成。例如: type hero= { age: number , name: string } 构建一个map方便的装载hero型数据 public heroMap:Record<number,hero>filterArray.filter()是内置的TypeScri
转载 2023-10-23 09:29:31
101阅读
1 使用了react官方脚手架:create-react-apphttps://github.com/facebook/create-react-appnpm run eject 可以打开配置文件自定义配置文件执行安装: npx create-react-app ts-with-react --typescriptnpx 只有在npm5.2以上版本才有1、避免安装全局模块:临时命令,使用
转载 2024-04-12 22:50:23
40阅读
示例: 1 const Home: React.FC = () => { 2 const textRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null); 3 4 useEffect(() => { 5 console.log(textR ...
转载 2021-09-25 10:48:00
635阅读
2评论
在现代前端开发ReactTypeScript 被广泛应用于构建高效、可维护的用户界面。为了使组件的样式更加优雅和模块化,CSS 的使用方式也非常重要。本文将探讨在 React TypeScript 项目中如何使用 CSS,包括常见的几种方式:传统的 CSS 文件、CSS Modules 和 Styled Components。同时,我们还会使用一些代码示例来演示它们的用法。 ## 1.
原创 10月前
110阅读
1. 网站示例:http://vikingship.xyz/?path=/story/%E6%AC%A2%E8%BF%8E%E6%9D%A5%E5%88%B0%E8%AF%BE%E7%A8%8B--welcome2. npm地址:https://www.npmjs.com/package/vikingship ======1. 动态类型语言VS静态类型语言动态类型语言:执行时才去数据类型
转载 2024-01-13 20:39:30
57阅读
目录React创建TS项目TS目录结构React函数组件类型React类组件类型        如果你已经掌握了TS基础类型、高级类型的使用,还想在前端项目中更深一层的使用TS,还需要掌握React、Vue、Angular等框架和框架提供的API,懂得如何在框架中使用TS,今天讲解如何在React项目中使用TS。如
转载 2023-11-22 22:24:31
638阅读
  • 1
  • 2
  • 3
  • 4
  • 5