javascript - 反应如何在反应js中找不到打印
问题描述
我有代码向 api 发出 post 请求并从表中的 api 获取所有数据。如果找到,我正在搜索带有货币名称的货币数据,如果找不到,我将在 div 中打印数据,如果找不到,我想打印在同一个 div 中找不到。
import { useState,useEffect } from "react";
import axios from "axios";
function CurrencyInfo (){
let [currData, setCurrData] = useState([])
let [searchData, setSearchData] = useState([]);
useEffect(()=>{
axios.get("https://api.coinbase.com/v2/currencies").then((res)=>{
setCurrData(res.data.data)
})
},[])
let Search = (event) =>{
event.preventDefault();
let arr = []
let toSearch = event.target.search.value;
currData.map((val)=>{
if(toSearch.toLowerCase() === val.name.toLowerCase()){
arr.push(val.name,val.id,val.min_size)
return setSearchData(arr)
}
})
}
return (
<div>
<form onSubmit={Search}>
<input type = "text" name="search"/><br/>
<input type= "submit" value="Search" className="buttons"/>
</form>
{searchData.map((val)=>{
return <div>{val}<div id="not"></div></div>
})}
<table border="1">
<tr>
<th>Name</th>
<th>Id</th>
<th>Minimum value</th>
</tr>
{currData.map((val)=>{
return (
<tr>
<td>{val.name}</td>
<td>{val.id}</td>
<td>{val.min_size}</td>
</tr>
)
})}
</table>
</div>
)
}
export default CurrencyInfo
解决方案
你可以试试这个来解决你的问题(假设你有name
货币参数):
{searchData.map((val)=>{
return <div>{val.name || 'not found'}</div>
})}
推荐阅读
- postgresql - 如何更新我的 circleCI 配置中的 max_connections 配置?
- python-3.x - 导入数学模块 - Python
- c# - DataGrid WPF 中的 TextColumn 样式为只读的 TextColumn 错误
- java - 如何通过 JButton 的操作将 TextField 值从一个 JFrame 获取到一个类
- javascript - 在 html 输入元素中只允许正值(包括十进制值)
- javascript - 阻止网站保存您查看过的特定页面
- java - 有什么比 BufferedReader 的 readLine() 方法更快的替代方法?
- symfony - 如何检查树枝中的多个 if 条件?
- sql - 需要帮助将 ID 列与另一个 ID 列链接以进行插入
- android - (AMD 使用 Windows 和 Android Studio)错误:x86 仿真当前需要硬件加速