首页 > 解决方案 > 反应如何在反应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

标签: javascripthtmlreactjs

解决方案


你可以试试这个来解决你的问题(假设你有name货币参数):

{searchData.map((val)=>{
        return <div>{val.name || 'not found'}</div>                      
    })}

推荐阅读