当前位置: 首页 > news >正文

React 18 + Hooks +Ts 开发中遇到的问题及解决方案!

这篇文章是用来专门记录关于React 18 + Hooks +Ts 开发中遇到的问题及解决方案

Q1

问题描述:

TS7016: Could not find a declaration file for module 
'js-export-excel'. '/Users/zhangliangliang/WebstormProjects/daizhang-system-front/node_modules/js-export-excel/lib/index.js' 
implicitly has an 'any' type.<br/>Try `npm i --save-dev @types/js-export-excel` 
if it exists or add a new declaration (.d.ts) file containing `declare module 'js-export-excel';`

分析问题: 根据控制台报错信息提示,,可能是跟项目中用的Ts 语法标准有关,

解决问题:
1. 手动声明模块类型

无法找到’js-export-excel’的类型声明文件,可以手动声明这个模块的类型。在代码中添加一个名为’js-export-excel.d.ts’的文件,并在文件中添加以下代码:

declare module ‘js-export-excel’;

这个代码告诉 TypeScript,'js-export-excel’模块的类型是任意的。这样,代码就可以正常编译了。

2.安装类型声明文件

通过运行以下命令来安装类型声明文件:

npm i --save-dev @types/js-export-excel

这个命令会安装一个名为’@types/js-export-excel’的包,这个包包含了’js-export-excel’模块的类型声明文件。安装完成后,代码就可以正常编译了。

总结:引用插件 考虑Ts 适配问题

Q2

问题描述:
Expression statement is not assignment or call;报错代码:‘主营业务收入’: (v.mainBusinessIncome?/100).toFixed(2),

问题分析
错误可能是由于缺少变量声明或语法错误导致的。确保在使用变量之前先声明它们,并检查代码中是否有其他语法错误。
另外,代码中有一个问号,这可能会导致语法错误。如果想要使用条件运算符,请确保它的语法正确。

解决问题

修复代码,已经声明了变量v和mainBusinessIncome:

'主营业务收入' :  v.mainBusinessIncome ? (mainBusinessIncome / 100).toFixed(2) : '';

总结:需要对变量类型进行明确

相关文章:

React 18 + Hooks +Ts 开发中遇到的问题及解决方案!

这篇文章是用来专门记录关于React 18 Hooks Ts 开发中遇到的问题及解决方案 Q1 问题描述&#xff1a; TS7016: Could not find a declaration file for module js-export-excel. /Users/zhangliangliang/WebstormProjects/daizhang-system-front/node_modules/js-export-exc…...

推荐一个非常好用的uniapp的组件库【TMUI3.0】

文章目录 前言官网地址如何使用&#xff1f;注意事项后言 前言 hello world欢迎来到前端的新世界 &#x1f61c;当前文章系列专栏&#xff1a;前端系列文章 &#x1f431;‍&#x1f453;博主在前端领域还有很多知识和技术需要掌握&#xff0c;正在不断努力填补技术短板。(如果…...

LeetCode(19)最后一个单词的长度【数组/字符串】【简单】

目录 1.题目2.答案3.提交结果截图 链接&#xff1a; 58. 最后一个单词的长度 1.题目 给你一个字符串 s&#xff0c;由若干单词组成&#xff0c;单词前后用一些空格字符隔开。返回字符串中 最后一个 单词的长度。 单词 是指仅由字母组成、不包含任何空格字符的最大子字符串。 …...

使用Docker本地安装部署Drawio绘图工具并实现公网访问

目录 前言 1. 使用Docker本地部署Drawio 2. 安装cpolar内网穿透工具 3. 配置Draw.io公网访问地址 4. 公网远程访问Draw.io 前言 提到流程图&#xff0c;大家第一时间可能会想到Visio&#xff0c;不可否认&#xff0c;VIsio确实是功能强大&#xff0c;但是软件为收费&…...

IDEA导入jar包

通过maven导入本地包 mvn install:install-file -DfileD:\WebProject\ERP\zhixing-heyue-erp-server\zxhy-service-api\src\main\java\com\zxhy\service\api\invoice\baiwang\lib\com_baiwang_bop_sdk_outer_3_4_393.jar -DgroupIdcom.baiwang -DartifactIdbaiwang.open -Dver…...

使用flutter的Scaffold脚手架开发一个最简单的带tabbar的app模板

flutter自带的scaffold脚手架可以说还是挺好用的&#xff0c;集成了appBar&#xff0c;还有左侧抽屉&#xff0c;还有底部tabbar&#xff0c;可以说拿来就可以用了啊&#xff0c;所以我今天也体验了一下&#xff0c;做了一个最简单的demo&#xff0c;就当是学习记录了。 效果展…...

aws服务器配置密码登陆

在 AWS 上&#xff0c;EC2 实例默认使用密钥对进行身份验证&#xff0c;而不是密码登录。不过&#xff0c;你可以通过以下步骤在 EC2 实例上启用密码登录&#xff1a; 登录 AWS 管理控制台并导航到 EC2 服务。 选择要配置密码登录的目标 EC2 实例。 在底部的 “描述” 标签页…...

【命令行魔法:掌握Linux基础工具开发的独门技艺】

本节目标 1.Linux 软件包管理器 2.Linux开发工具 3.Linux编译器-gcc/g使用 4.Linux项目自动化构建工具-make/Makefile 5.Linux第一个小程序&#xff0d;进度条 1.Linux 软件包管理器 yum 什么是软件包 在Linux下安装软件, 一个通常的办法是下载到程序的源代码, 并进行编译…...

虚拟DOM的原理和理解

Virtual DOM前言 在传统的Web开发中&#xff0c;直接操作真实的DOM通常是一个昂贵且低效的操作。为了解决这个问题&#xff0c;Virtual DOM&#xff08;虚拟DOM&#xff09;被引入为一个中间层&#xff0c;允许开发者在内存中进行操作&#xff0c;从而避免频繁且不必要的真实DO…...

C# WPF Threads 和 Dispatchers 有什么区别

在C# WPF&#xff08;Windows Presentation Foundation&#xff09;中&#xff0c;Threads&#xff08;线程&#xff09;和Dispatchers&#xff08;调度器&#xff09;之间的关系非常重要&#xff0c;因为WPF是一个基于STA&#xff08;单线程单元&#xff09;的UI框架。 Threa…...

【文末送书——数学经典著作】工科必备的数学思维培养

欢迎关注博主 Mindtechnist 或加入【智能科技社区】一起学习和分享Linux、C、C、Python、Matlab&#xff0c;机器人运动控制、多机器人协作&#xff0c;智能优化算法&#xff0c;滤波估计、多传感器信息融合&#xff0c;机器学习&#xff0c;人工智能等相关领域的知识和技术。关…...

【云备份项目两万字总结】服务端篇 -----附源码

项目总结 整体回顾逐步实现utill.hppconfig.hppdata.hpphot.hppservice.hpp 代码 整体回顾 服务端的目标是&#xff1a; 对客户端的请求进行处理管理客户端上传的文件 于客户端进行数据交换&#xff0c;我们需要引入网络&#xff0c;所以我们引入第三方库----httplib.h库&am…...

蓝眼开源云盘部署全过程(手动安装)

环境概述&#xff1a; 系统-Centos7.4 数据库-MySQL8 云盘系统-Tank4.0.1 前提&#xff1a;操作系统已完成安装&#xff0c;有外部网络。 一.安装数据库 cd到合适的目录进行下载安装操作&#xff0c;期间不要切换出去。 wget https://dev.mysql.com/get/mysql80-community-r…...

aliyun Rest ful api V3版本身份验证构造

aliyun Rest ful api V3版本身份验证构造 参考官网&#xff1a;https://help.aliyun.com/zh/sdk/product-overview/v3-request-structure-and-signature?spma2c4g.11186623.0.0.787951e7lHcjZb 构造代码 &#xff1a;使用GET请求进行构造&#xff0c;算法使用sha256 使用postm…...

windows10上使用Visual Studio对树莓派进行交叉编译示例

本文主要介绍通过Visual Studio对树莓派进行交叉编译的方法。 1 环境 宿主机&#xff1a; 系统&#xff1a;Windows10 开发平台&#xff1a;Visual Studio 2022 (我用的是社区版) VisualGDB: VisualGDB - Download (我下的试用版本) GNU工具链: Prebuilt GNU toolchain f…...

flutter开发web应用支持浏览器跨域设置

开发web应用难免会遇到跨域问题&#xff0c;所以flutter设置允许web跨域的设置是要在你的flutter安装路径下面 flutter\bin\cache 找到flutter_tools.stamp文件&#xff0c;然后删除掉&#xff1a;这个文件是临时缓存文件 然后找到 flutter\packages\flutter_tools\lib\src\web…...

C#调用C++动态库接口函数和回调函数方法

这篇文章主要介绍了C#调用C动态库接口函数和回调函数方法&#xff0c;通过C端编写接口展开内容&#xff0c;文章介绍详细具有一定的参考价值&#xff0c;需要的小伙伴可以参考一下 需求: 当前C已经写好了一个动态库&#xff0c;完成了产品开发需求&#xff0c;C#需要调用C编写…...

3D造型渲染软件DAZ Studio mac中文版介绍

DAZ Studio mac是一款3D造型和渲染软件&#xff0c;由 Daz 3D 公司开发。它允许用户创建、编辑、动画化并渲染精美的数字图像与动画。DAZ Studio 还提供了一个虚拟的3D艺术家工作室环境&#xff0c;让用户可以轻松地设置场景、布置角色和应用材质。 用户可以通过 DAZ Studio 中…...

破解tomcat密码并上传webshell

tomcat基础认证爆破 暴力破解 进入vulnhub的tomcat8目录&#xff0c;启动环境 由于tomcat密码默认最大尝试错误次数为5次&#xff0c;需要修改server.xml&#xff0c;修改下面字段 failureCount"10000000000" lockOutTime"0"tomcat默认界面&#xff0c;…...

Java 8 Stream 的使用场景

Java 8 Stream 的使用场景 只符合所筛选条件至多一条 CommonArea l common.stream().filter(item ->item.getName().equals("aa")).findAny().orElse(null);返回多条记录 List<Object> list common.stream().filter(item -> item.getName().equals(&…...

Python: 多优化算法TSP求解方案,物流路径规划代码实践 - 附详尽注释及标准数据集

Python&#xff1a;模拟退火算法、蚁群算法、遗传算法、粒子群算法求解旅行商问题(TSP)的Python代码程序。 物流路径规划问题。 -- 数据集采用的tsplib标准数据集&#xff0c;可以根据自己需求修改城市坐标。 代码完整&#xff0c;注释详细&#xff0c;打印每次迭代结果&#x…...

LangFlow+Ollama快速部署:3步搭建本地AI应用开发环境

LangFlowOllama快速部署&#xff1a;3步搭建本地AI应用开发环境 想快速搭建一个属于自己的AI应用开发环境&#xff0c;但又不想折腾复杂的命令行和配置&#xff1f;今天&#xff0c;我来分享一个极其简单的方法&#xff1a;用LangFlow和Ollama&#xff0c;只需3步&#xff0c;…...

ResNet50人脸重建作品集:cv_resnet50_face-reconstruction在艺术创作中的人脸风格迁移底图生成

ResNet50人脸重建作品集&#xff1a;cv_resnet50_face-reconstruction在艺术创作中的人脸风格迁移底图生成 1. 项目介绍与核心价值 cv_resnet50_face-reconstruction 是一个基于ResNet50架构的人脸重建项目&#xff0c;专门为艺术创作和设计工作提供高质量的人脸底图生成服务…...

IDEA插件开发:集成Nunchaku-flux-1-dev实现代码注释自动图解

IDEA插件开发&#xff1a;集成Nunchaku-flux-1-dev实现代码注释自动图解 1. 引言 作为一名Java开发者&#xff0c;你是否曾经面对过这样的困境&#xff1a;接手一个复杂的遗留系统&#xff0c;代码量庞大但注释稀少&#xff0c;逻辑关系错综复杂&#xff0c;光是理解代码执行…...

Qwen3-Reranker-0.6B一文详解:轻量0.6B参数如何实现SOTA级重排序性能

Qwen3-Reranker-0.6B一文详解&#xff1a;轻量0.6B参数如何实现SOTA级重排序性能 1. 引言&#xff1a;为什么你需要关注这个0.6B的小模型&#xff1f; 如果你用过搜索引擎&#xff0c;肯定有过这样的体验&#xff1a;输入一个问题&#xff0c;搜出来一堆结果&#xff0c;但真…...

Wan2.1视频生成小白必看:避开这些坑,让你的视频生成一次成功

Wan2.1视频生成小白必看&#xff1a;避开这些坑&#xff0c;让你的视频生成一次成功 1. 为什么你的视频生成总是失败&#xff1f; 很多新手第一次使用Wan2.1视频生成模型时&#xff0c;都会遇到各种问题&#xff1a;生成的视频模糊不清、内容与描述不符、甚至直接失败。这通常…...

别再手动改配置了!用Docker Compose一键部署Pikachu靶场,5分钟搞定测试环境

5分钟极速搭建Pikachu靶场&#xff1a;Docker Compose自动化实战指南 每次准备网络安全练习环境时&#xff0c;最头疼的莫过于反复安装配置各种服务——PHP版本不兼容、MySQL连接失败、Web服务器配置错误...这些琐碎问题消耗了本应用于渗透测试学习的宝贵时间。今天要分享的这套…...

忍者像素绘卷参数详解:如何通过提示词触发‘火之意志’专属风格权重

忍者像素绘卷参数详解&#xff1a;如何通过提示词触发火之意志专属风格权重 1. 认识忍者像素绘卷 忍者像素绘卷是一款基于Z-Image-Turbo深度优化的图像生成工具&#xff0c;它将传统忍者文化与16-Bit复古游戏美学完美结合。这款工具特别适合创作具有热血动漫风格的像素艺术作…...

DanKoe 视频笔记:创作者指南:如何摆脱新手地狱

在本教程中&#xff0c;我们将学习创作者如何突破最初的停滞期&#xff0c;即所谓的“新手地狱”。我们将探讨导致这一困境的核心原因&#xff0c;并提供一系列具体、可操作的策略&#xff0c;帮助你建立权威、创作吸引人的内容、有效建立网络&#xff0c;并最终构建可持续的个…...

Fay数字人框架终极指南:30分钟打造你的AI虚拟助手

Fay数字人框架终极指南&#xff1a;30分钟打造你的AI虚拟助手 【免费下载链接】Fay Fay 是一个开源的数字人类框架&#xff0c;集成了语言模型和数字字符。它为各种应用程序提供零售、助手和代理版本&#xff0c;如虚拟购物指南、广播公司、助理、服务员、教师以及基于语音或文…...