我在尝试使用调用 API 方法从数据库中删除所选项目的删除函数时遇到问题。
API 只接受页面 ID，所以我一直在尝试将 ID 发送到 api。
这是应用程序主容器中的函数。
deletePage(id) {
instance.put(`/admin/deletePage/${id}`).then((response) => {
this.getPages();
window.location.replace('/')
}).catch((error) => {
console.log(error)
})
}
然后我将此函数作为道具传递给 Dashboard 组件，在那里我创建另一个函数来处理删除：
handleDelete(e, id) {
e.preventDefault()
this.props.deletePage(id)
}
最后，我的渲染功能：
render() {
const pages = this.props.pages.map((page, i) => {
return (
<div key={i}>
<h2>{page.title}</h2>
<a href={`/admin/edit-page/${i}`}>Edit</a>
<button onClick={this.handleDelete(i)}>Delete</button>
</div>
)
});
return (
<div>
<h2>Dashboard</h2>
{pages}
</div>
);
}
目前我在控制台中收到此错误： e.preventDefault is not a function
如果我删除 preventDefault 行，它只会导致不断重新加载。
请帮忙。只是想删除东西 mwhaha
您应该使用高阶函数来执行此操作。它只是一个返回另一个函数的函数。
handleDelete(id) {
return (event)=> {
event.preventDefault()
this.props.deletePage(id)
}
}
然后像以前一样调用
<button onClick={this.handleDelete(i)}>Delete</button>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句