React:Expected property name or ‘}‘ in JSON at position 1

代码:

import { Form, Input, Button } from 'antd'
export default function FormCom() {
  function onFinish(a, b, c, d) {
    console.log(a, b, c, d)
  }
  const describe = "{tip:'请输入用户名'}"
  return (
    <>
      <Form onFinish={onFinish}>
        <Form.Item
          name="username"
          label="Username"
          help={JSON.parse(describe)?.tip || ''}  // 报错位置
        >
          <Input />
        </Form.Item>
        <Form.Item>
          <Button type="primary" htmlType="submit">
            Submit
          </Button>
        </Form.Item>
      </Form>
      <div></div>
    </>
  )
}

出现这个error的原因是react不能将JSON.parse识别为普通的对象,可以采用两种方式解决这个error:
1、箭头函数的形式 ()=>JSON.parse(describe)?.tip || '' "

2、在渲染dom之间提前将describe字段转成普通的对象,再进行渲染。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/682430.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Bowyer-Watson算法

数学原理及算法过程 Delaunay 三角剖分是一种特殊的三角剖分方法&#xff0c;它满足以下两个重要性质&#xff1a; 最大化最小角性质&#xff1a;Delaunay 三角剖分通过避免细长的三角形来最大化所有三角形的最小角。空外接圆性质&#xff1a;在 Delaunay 三角剖分中&#xf…

course-nlp——2-svd-nmf-topic-modeling

本文参考自https://github.com/fastai/course-nlp。 使用NMF and SVD进行主题建模 问题 主题建模是开始学习 NLP 的一种有趣方式。我们将使用两种流行的矩阵分解技术。考虑最极端的情况——使用两个向量的外积重建矩阵。显然&#xff0c;在大多数情况下&#xff0c;我们无法…

【常见报错】影刀小窗口消失-作者:【小可耐教你学影刀RPA】

现象描述&#xff1a; 影刀能够正常登录并运行&#xff0c;但是从常规模式切换到调度模式后能出现启动页&#xff0c;然后程序就退出了&#xff0c;查看影刀日志和事件查看器中的日志都没有任何异常消息 问题原因&#xff1a; 正常切换调度后会在窗口右下角出现一个机器人的小…

vue-pdf 部分中文显示错误,第二次打开是空白,解决方法

首先鸣谢 1. https://blog.csdn.net/m0_71537867/article/details/131614868?spm1001.2014.3001.5506 2. https://blog.csdn.net/weixin_43763952/article/details/133769647 3. https://github.com/FranckFreiburger/vue-pdf/issues/229 4. https://blog.csdn.net/weixin_449…

最新OpenAI免费API-openai api key获取方式

最近又开始准备LLM 应用开发&#xff0c;要用到api key&#xff0c;才发现过我之前免费发放的额度没了&#xff01;我都没咋用过&#xff0c;痛心&#x1f62d;&#x1f62d;&#x1f62d;&#xff01; 现在 OpenAI 有要求必须充值 5 刀才能使用&#xff0c;问就是没钱&#x…

思维,1209G1 - Into Blocks (easy version)

一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 Problem - 1209G1 - Codeforces 二、解题报告 1、思路分析 考虑&#xff1a; 最终状态为若干段相同数字&#xff0c;且任意两段数字不同 每个数字出现的最左下标和最右下标构成一个区间 连锁反应—…

《微服务大揭秘:SpringBoot与SpringCloud的魔法组合》

加入我们的探险队伍&#xff0c;一起深入SpringBoot与SpringCloud构建的微服务世界。以轻松幽默的笔触&#xff0c;带你一步步揭开微服务架构的神秘面纱&#xff0c;从服务发现的智能地图Eureka&#xff0c;到API网关Zuul的城市门卫&#xff0c;每一个环节都充满了惊喜。不仅如…

连锁店如何通过连锁收银系统做会员营销

随着消费者对个性化、定制化服务需求的不断增长&#xff0c;会员营销已成为连锁店吸引和留住顾客的关键策略之一。而连锁收银系统作为信息管理和营销工具的核心&#xff0c;可以发挥重要作用。下面商淘云将从数据分析与个性化营销、会员积分与促销激励、跨店通用与会员互动三个…

挂上了代理加速器梯子之后,Git clone指令下载仍旧很慢的问题

当你使用了各种代理软件访问诸如Github、Google、油管、推特这些网址&#xff0c;你会发现基本可以访问&#xff0c;只不过是访问速度不同&#xff0c;但是不管你使用什么代理软件&#xff0c;你的git clone指令从Github远程库下载库的速度都不会受到影响。 当使用代理软件访问…

宝塔nginx配置

将跟php有关的注释掉&#xff1a; 添加&#xff1a; #解决vue刷新404问题try_files $uri $uri/ /index.html; location /prod-api/ {proxy_set_header Host $http_host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header REMOTE-HOST $remote_addr;proxy_set_header…

Python Lambda函数的应用实例教程

在Python编程中&#xff0c;lambda函数是一种简洁且强大的工具&#xff0c;用于创建小型匿名函数。它们在需要快速定义简单函数时特别有用。本文将详细介绍lambda函数的语法及其多种应用实例&#xff0c;帮助读者更好地理解和使用lambda函数。 一、lambda函数的基本概念 1.1 什…

RabbitMQ支持的消息模型

RabbitMQ基础RabbitMQ支持的消息模型 一、第一种模型(直连) 我们将用Java编写两个程序&#xff0c;发送单个消息的生成者和接收消息并打印出来的消费者。 在下图&#xff0c;“P”是生成者&#xff0c;“C”消费者。中间框是一个队列RabbitMQ保留的消息缓冲区 。 首先构建一个…

win11右键二级菜单恢复成win10一级菜单

winr输入“cmd”回车&#xff0c;打开cmd窗口&#xff0c;输入如下命令&#xff0c;并回车。reg add "HKCU\Software\Classes\CLSID\{86ca1aa0-34aa-4e8b-a509-50c905bae2a2}\InprocServer32" /f /ve提示cuccessfully&#xff0c;表示操作成功。重启电脑即可。 如下…

测试记录3:WLS2运行Linux界面

1.WLS1转到WLS2 &#xff08;1&#xff09;根据自己的平台&#xff0c;下载WLS2安装包 x64: https://wslstorestorage.blob.core.windows.net/wslblob/wsl_update_x64.msi arm64: https://wslstorestorage.blob.core.windows.net/wslblob/wsl_update_arm64.msi &#xff08;2&…

《2024年网络安全预测:未来规划深度洞察》

2024 年打击网络对手的计划。 阅读报告&#xff0c;了解我们的专家对 2024 年网络安全行业的预测&#xff0c;包括&#xff1a; 攻击者将人工智能融入其行动中&#xff0c;防御者利用它来加强检测和响应 民族国家继续开展网络行动以实现其地缘政治目标 攻击者继续利用零日漏洞…

word 无法自动检测拼写

word 有时候不能分辨是哪种语言,比如把英语错认为法语 。 例如&#xff1a;Interlaayer spacace,发现误认为是法语。 1、选中Interlaayer spacace 2、点击语言下拉按钮 选择设置校对语言 发现校对语言为法语 3、手动修改校对语言为英语&#xff0c;并点击确认。 4、发现现…

【ARM Cache 及 MMU 系列文章 6.1 -- Cache maintenance 相关寄存器及指令详细介绍】

请阅读【ARM Cache 及 MMU/MPU 系列文章专栏导读】 及【嵌入式开发学习必备专栏】 文章目录 Cache Maintenance registers and instructionsDCZID_EL0DCZID_EL0寄存器字段解释 DCZ 使用场景Cache maintenance 范围选择 Cache maintenance 指令集 Cache Maintenance registers a…

学习笔记——路由网络基础——等开销负载均衡

3、等开销负载均衡 等开销负载均衡&#xff1a;到达同一目标网段&#xff0c;存在多条路由条目&#xff0c;存在两条或两条以上的路由优先级值和开销值都是最优的(优先级值和开销值一致)&#xff0c;则这几条路径执行负载均衡(在ping中就是这条路由发个包再下一条路由再发个包…

如何进行光伏户用开发?

1、业主端使用 业主使用手机端进行账户注册&#xff0c;填写个人信息&#xff1b;开设银行二类卡&#xff0c;用于电费的结转。之后就可以进行线上合同签署。 2、踏勘收资 大家可以借助一些踏勘软件&#xff0c;例如无人机踏勘、卫星踏勘等&#xff0c;使用无人机搭载高清摄…

超实惠的GPU云服务器安利!!

自己一个人抱着老笔记本学深度学习&#xff0c;没有GPU是真的难受。Colab用过&#xff0c;GPU稍微用用就被剥夺了。华为云在培训的时候也用过&#xff0c;好贵。现在学到大模型&#xff0c;cuda10.1举步维艰。 失眠在网上冲浪&#xff0c;刷到了潞晨云&#xff0c;一块六就能用…