代码之家 › 专栏 › 技术社区 › anjanesh

如何将道具回调传递到路线?

reactjs

anjanesh · 技术社区 · 5 年前

在我父母身上应用程序.js我有文件:

<Route path="/login" component={Login} onFormSubmit={this.onLoginSubmit} />

但是在登录.js当我这样做时:

this.props.onFormSubmit(this.state.email, this.state.password);

我得到: 类型错误:this.props.onFormSubmit不是函数

编辑:我看到这是一个解决方法:

<Route path="/login" render={(props) => (<Login onFormSubmit={this.onLoginSubmit} {...props} />)} />

2 回复 | 直到 5 年前

Nilesh Patel 5 年前

你应该使用这样的渲染道具。

<Route
  path='/login'
  render={(props) => (
    <Login onFormSubmit={this.onLoginSubmit}  />
  )}
/>

Reynard D 5 年前

我假设你正在使用 react-router-dom Route component只向component属性注入三个属性, Login .

https://reactrouter.com/web/api/Route/route-props ,但基本上只有以下值会被 路线 到组成部分:

位置代表了应用程序现在的位置,你想要它去哪里,甚至它曾经在哪里

本文档中的术语history和“history object”指的是history包,它是React Router仅有的两个主要依赖项之一(除了React本身),它提供了几种不同的实现,用于在各种环境中用JavaScript管理会话历史

因此,传递任意属性值 onFormSubmit 从那以后就不起作用了 路线 . 如果你真的需要暴露 this.onLoginSubmit

推荐文章

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

Facundo Cabrera · 意外的应用程序错误!useNavigate()只能在<Router>组件的上下文中使用

1 年前

user29295031 · 如何使用react和vite覆盖Tailwinds css 4默认设计

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Luckkks · 过渡色工作不正常

1 年前

ModernEraCaveman · 如何对齐我的Bootstrap容器以适应网页的整个宽度?

1 年前

vatsal chauhan · 即使在字体预加载时,文本加载也很慢

1 年前

hasratyan · Next.js 15 API路由-动态路由中的无效GET导出错误[id]

1 年前

noblerare · Vite错误-未定义导出(SSR)

1 年前

ProfessorFinesse · 在默认表单中完成帖子请求时,“res.send”会去哪里?

1 年前