首页 > 解决方案 > 删除请求用钩子反应本机

问题描述

当用户按下我定义项目但我没有这样做的按钮时,我正在尝试删除。你能帮我按下按钮,删除项目吗?在 url 中,您可以看到我用于第一次获取请求的 json,之后我想为删除请求提供操作按钮。

 export default function Categories(){

    const [data,setData]=useState({});
    const categoriesUrl ="https://northwind.vercel.app/api/categories"
    const [name,setName]=useState([]);
    const [description,setDescription]=useState([]);
    const [id,setID]=useState([]);
    const [status,setStatus]=useState([]);

    useEffect(()=>{
    fetch(categoriesUrl)
    .then((response)=>response.json())
    .then((json)=>{
        setData(json);
    })
     .catch((error)=>console.error(error))   

    });
    

    const deleteApi=(id)=>{
        fetch("https://northwind.vercel.app/api/categories/"+id,{method: 'DELETE'})
        .then(()=>setStatus('Delete Successful'));  
    }
   

    return(
        <SafeAreaView>
        <View style={styles.container}>
            <FlatList 
            data={data} keyExtractor={({id},index)=>id}
            renderItem={({item})=>(
            <View style={{paddingBottom:10}}>
            <Text style={styles.categoriesText}>
            {item.id}.{item.description},{item.name}
            <Button onClick={()=>deleteApi(data.id)}></Button>
            </Text>  
            </View>
            )} >
            
            </FlatList>
        </View>
        </SafeAreaView>
    );

    };

标签: react-nativeapi

解决方案


推荐阅读