React的一些使用技巧

最新推荐文章于 2024-01-07 11:15:00 发布
最新推荐文章于 2024-01-07 11:15:00 发布
阅读量387 收藏
点赞数
分类专栏： React 文章标签： react修改默认端口
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/inthuixiang/article/details/84379309
版权

目前使用的React版本是16.6.3
项目是直接通过脚手架命令自动生成的

1. 修改默认的启动端口号

最开始，默认的启动端口号是3000，怎样能修改成其他的端口号
对项目目录下的 package.json文件中的 scripts的 start值进行修改

默认如下图：
在这里插入图片描述

修改成以下值（将端口改成9000）
在这里插入图片描述

修改完成cnpm run start ，打开的页面的端口号就不是默认的3000而是9000了，

2. 待续…

kivet.whx
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
react hook使用分享
10-13
下面是对 React Hook 的使用分享，包括为什么要用 Hook、Hook 与其他方案的对比、Hook 的使用技巧等。 一、为什么要用 Hook Hook 主要解决一个核心问题：逻辑复用。逻辑组件直接沿用 class component 不可以吗？...
React 16.6.3 eject 实现antd 按需加载和定制主题
前端小愤青
11-29 2513
目录 1.安装babel-plugin-import 2.修改package.json 二，定制主题 1.reject项目 2.安装less-loader 3.修改开发环境（webpack.config.dev.js） 4.修改生产环境（webpack.config.prod.js）   前言：    由于React版本不一致，所以reject后webpack版本也有所不同，因...
react常用50个技巧
大灰狼的小绵羊哥哥的博客
04-04 565
使用JSX语法编写模板 在模板中使用props属性传递数据 使用state来管理组件内部的状态 通过设置组件的key属性来优化列表渲染性能 使用Ref来访问DOM元素或组件实例 使用React生命周期方法来控制组件的行为 支持条件渲染和循环渲染 使用事件处理程序处理用户交互行为 使用组件之间的通信来实现更复杂的功能 使用Hooks来管理状态和副作用 使用Redux或其他状态管理库来管理应用程序级别的状态 添加路由来实现应用程序的导航 使用懒加载组件来提高页面加载性能 避免在rend
7大提高 React 性能的技巧，不看后悔！
qq_41838305的博客
04-08 414
这对我们来说意味着，在协调期间，将重新创建所有函数实例，以便能够考虑新的状态值，我们不需要它，在大多数情况下，函数可以只依赖于几个状态，我们不想重新创建不依赖于已更改状态的函数实例。这段代码的问题是，即使其他一些状态发生变化，比如 otherState，foo 也会被重新创建，这是我们实际上不想要的。意思是，如果我们有一个巨大的组件，它有很多状态（不需要相互依赖）并且其中一个状态发生了变化，它将重新渲染整个组件元素，这绝对不是我们想要的。它会影响用户体验，人们不会等待，只会离开您的网站。
React开发必须掌握的14个实践技巧
WPHunter的编程技术资料库！
01-07 1215
在本教程中，我们将首先讨论React开发人员面临的一些常见挑战，然后深入探讨一些你可以遵循的最佳实践，以帮助你以更有效的方式编写React代码。
这可能是你需要的React实战技巧
grooyo的博客
10-04 314
你可以看到不管 antd(react) 还是 element(vue) 中的弹窗组件都是渲染在 document.body 上的，而非当前组件所对应的 render 节点上。的使用，当你掌握了这两者，诸如 Toast、Dialog、Dropdown 大体都是一个实现原理。也是要执行比较逻辑，当入参数非常复杂时，这样优化其实是得不偿失的，所以具体情况要具体分析。总结一下，最后的这个组件有多种实现方式，这里只是很简单的演示一下，关键点在你要掌握。例子，实际是不需要考虑优化的，因为本身。
详解React Native顶|底部导航使用小技巧
01-21
导航一直是App开发中比较重要的一个组件，ReactNative提供了两种导航组件供我们使用，分别是：NavigatorIOS和Navigator，但是前者只能用于iOS平台，后者在ReactNative0.44版本以后已经被移除了。 好在有人提供了更好...
React Native react-navigation 导航使用详解
08-28
下面我们将详细介绍 react-navigation 库的使用和实战技巧。 一、开源库介绍 React Native 中的 react-navigation 库是新兴的开源库，由 Facebook 推荐使用，并且在 React Native 当前最新版本 0.44 中将 ...
react的一些demo
08-13
"react_demo"可能包含了一些使用这些库的例子，让你理解如何在React应用中实现高效的状态管理。 8. **React性能优化**：React提供了很多优化手段，如PureComponent、shouldComponentUpdate、React.memo等。通过分析...
React框架速成技巧：前端新手变高手的必经之路
最新发布
06-11
React，作为一个由Facebook开发并维护的前端JavaScript库，已经成为现代Web开发领域的重要组成部分。它以其组件化、声明式和高效的特点，赢得了广泛的关注和采用。本教程专为前端小白设计，旨在提供一个全面而易于...
十种React性能优化方式
一个不掉头发的资深小白
08-10 1371
对于纯展示的组件（没有内部状态或依赖），使用 PureComponent 或自定义的 shouldComponentUpdate 方法，可以避免不必要的重新渲染。对于那些不依赖于父组件传入的 props 的函数组件，可以使用 React.memo 进行包裹，减少不必要的重渲染。对于页面上不是首次加载就需要的组件，可以采用懒加载的方式，按需加载它们，减少初始渲染体积和提高首屏加载速度。这些是一些常见的 React 性能优化技巧，可以根据具体项目需求和场景灵活应用，以提升应用的性能和用户体验。
React 开发必须知道的 34个技巧
大灰狼的小绵羊哥哥的博客
05-19 1549
前言 React 是前端三大框架之一,在开发中也是一项技能; 本文从实际开发中总结了 React 开发的一些技巧技巧,适合 React 初学或者有一定项目经验的同学 序列文章:Vue 开发必须知道的 36 个技巧【近1W字】 源码地址 请戳， 欢迎 star 效果图 1 组件通讯 1.1 props 子组件 import React from "react"; import PropTypes from "prop-types"; import { Button } fro..
React使用小技巧
lyl0530的博客
07-17 773
1. React 中Toast的使用 方法所在文件夹：node_modules/antd-mobile/lib/toast/index.d.ts 导入： import { List, Button, Modal, Toast } from 'antd-mobile'; 使用： Toast.info('解绑？', 1);//参1，提示；参2，显示的秒数 show/info/success/fail/offline/loading/hide/config 2. 页面...
干货！几个灰常实用的React实践技巧（收藏）
前端下午茶
10-27 846
背景Hooks 自推出以来就很火， 它改变了我们编写React 代码的方式， 有助于我们写更简洁的代码。今天这边文章不是说Hooks的，Hooks之外， 还有很多实用的技巧可以帮助我们便...
【译】React16.3+ 生命周期
xiaozhuo_tang的博客
11-07 1076
React 16.3+ 生命周期 16.3版本向我们介绍了一些新的生命周期函数，他们将会替代已存在的生命周期函数并提供更好的React异步支持。本文基于之前的文章的更新，因此将会聚焦于新的生命周期函数而不是所有的生命周期函数。 static getDerivedStateFromProps(nextProps, prevState) 这个新的函数主要致力于确保在需要state和props的时候是同...
React16.3后的生命周期理解
xjl271314的博客
09-06 873
可以直接拷贝这段代码，然后执行打开控制台查看生命周期的流程。 //ComponentLifeCycle import React, { Component } from 'react'; export default class ComponentLifeCycle extends Component { constructor(props) { super(prop...
React 16.6新API
大灰狼的小绵羊哥哥的博客
11-18 1429
一.概览 新增了几个方便的特性： React.memo ：函数式组件也有“shouldComponentUpdate”生命周期了 React.lazy ：配合Suspense特性轻松优雅地完成代码拆分（Code-Splitting） static contextType ：class组件可以更容易地访问单一Context static getDerivedSt...
【译】最新版本react组件生命周期详解（v16.3.1）
mytac的博客
04-09 8673
16版本的react对组件的生命周期函数进行了一些修改，在每个react组件中都有以下几个生命周期方法~我们需要在不同阶段进行讨论。为了良好的阅读体验，请查看github原文 组件生命周期概述 1.初始化 在组件初始化阶段会执行 1. constructor 2. static getDerivedStateFromProps() 3. componentWillMount()...
React 16.6 发布，一大波新功带你看未来的 React 开发方式
大灰狼的小绵羊哥哥的博客
10-30 3076
最近（2018-10-23）React官方发布了16.6版本，开放了一堆新的功能，而这其中的一些新功能，代表这未来的React开发方式，让我们来一起窥探未来吧。 lazy 最让人期待的功能肯定就是lazy功能了，配合发布了一个Suspense组件，也就是最开始命名为Placeholder的组件，用来配合render方法内部的异步操作的，让我们先来看一下lazy的用法 import Reac...
react 中 remote 使用技巧
05-24
下面是几个 Remote 组件使用技巧： 1. Remote 组件可以通过 props 或者 context 传递 API 的基础路径和其他配置信息，方便统一管理和修改。 2. Remote 组件支持 Promise 风格的调用方式，可以使用 async/await ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值