Javascript 为什么使用触发方法？

我创建了REACT组件，并通过按下按钮，使用reduxconnect传递方法进行调用。有一个代码：

const PageClientOne = ({onSubmit, onDelete, client}) => {
    return(
        <form style={styles.enter} onSubmit={_handleSubmit(client,onSubmit)}>
        // ... something code

            <Button type="submit" theme="success">Save</Button>
            <Button type="button"
                            theme="error" onClick={onDelete(client._id)}>Delete</Button>
        </form>
    )
}

const _handleSubmit = (client, onSubmit) => {
    return event => {
        event.preventDefault()
        onSubmit(client)
    }
}

const mapStateToProps = (state, ownProps) => {
    return {
        client: state.reducers.clientsState.client
    }
}

const mapDispatchToProps = (dispatch) => ({
    onSubmit: (client) => {
        dispatch(saveClient(client))
    },
    onDelete: (id) => {
        console.log("DELETE")
    }
}

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(PageClientOne)

constpageclientone=（{onSubmit，onDelete，client}）=>{
返回(
//…一些代码
拯救
删除
)
}
const_handleSubmit=（客户端，onSubmit）=>{
返回事件=>{
event.preventDefault（）
onSubmit（客户端）
}
}
const mapStateToProps=（state，ownProps）=>{
返回{
客户端：state.reducers.clientsState.client
}
}
const mapDispatchToProps=（调度）=>({
onSubmit：（客户端）=>{
调度（保存客户端（客户端））
},
onDelete：（id）=>{
控制台日志（“删除”）
}
}
导出默认连接(
MapStateTops，
mapDispatchToProps
)（PageClientOne）

问题是页面加载时会触发onDelete，而不仅仅是在单击按钮时。我做错了什么？

（我不太熟悉React，所以这可能是错误的…）

当您创建

元素时，您可以这样定义按钮：

<Button type="button" theme="error" onClick={onDelete(client._id)}>Delete</Button>

---

它的反应稍有不同

改变这个,

<Button type="button" theme="error" onClick={onDelete(client._id)}>Delete</Button>

删除

对,

onDelete（客户端.\u id）}>Delete

请阅读此处了解更多信息

---

问题正在讨论中

<Button type="button" theme="error" onClick={onDelete(client._id)}>Delete</Button>

删除

在创建元素时，您实际上是在调用onDelete，而不是传递回调函数

试一试

删除

---

希望有帮助。

我希望我的答案与你的问题相对应。 看起来您的删除按钮在刷新页面时正在提交表单。 因此，您需要防止提交

const mapDispatchToProps = (dispatch) => ({
    onSubmit: (client) => {
        dispatch(saveClient(client))
    },
    onDelete: (evt, id) => {
        evt.preventDefault()
        console.log("DELETE")
    }
}

在你的删除按钮上

<Button type="button" theme="error" onClick={(evt) => onDelete(evt, client._id)}>Delete</Button>

onDelete（evt，客户端.\u id）}>Delete

为什么要调用此方法？IDK:-p但请将问题的

标题作为问题的重要部分正确表达。当你要求大多数人通读描述和代码以理解问题时，一个不清楚的
标题将失去他们的注意力。@Rajesh我同意，尽管记住这一点对ma来说很好因此，英语不是他们的第一语言。在我看来，PageClientOne是一个纯粹的函数，在这种情况下，如果您的状态或支持父组件，请单击激发父组件函数以重新呈现子组件。
<Button type="button" theme="error" onClick={onDelete.bind(this, client._id)}>Delete</Button>

const mapDispatchToProps = (dispatch) => ({
    onSubmit: (client) => {
        dispatch(saveClient(client))
    },
    onDelete: (evt, id) => {
        evt.preventDefault()
        console.log("DELETE")
    }
}

<Button type="button" theme="error" onClick={(evt) => onDelete(evt, client._id)}>Delete</Button>