Question

我的网页上有一个组件，其中包含一个表格，其中有两个输入文字：名称和电子邮件：

<form onSubmit={this.handleSubmit} action="register">
    <input
      type="text"
      placeholder="Name"
      value={this.state.name}
      onChange={this.handlNameChange}
    />
    <input
      type="text"
      placeholder="Email"
      value={this.state.email}
      onChange={this.handleEmailChange}
    />
    <button className="btn btn-success btn-block">Cadastre-se</button>
</form>

我想将这两个输入的数据传递给另一个名为register的页面（是表单的动作），它有自己的组件形式。在寄存器中，我有一个类似的结构形式，但有更多的输入。

路由器看起来像这样：

<Router history={browserHistory}>
    <Route path="/" component={MainLayout}>
        <IndexRoute component={Home} />
        <Route path="about" component={About} />
    </Route>
    <Route path="/register" component={Register} />
    <Route path="*" component={NotFound} />
</Router>

如何在不同页面中将数据从一个表单/组件传递到另一个表单/组件？

如何访问其他页面组件（注册）中的数据？

谢谢。

Answer 1

有几个选项，使用Session可能是最简单的。

handleSubmit() {
  Session.set("name", this.state.name);
  Session.set("email", this.state.email);
}

在您的Register组件中：

componentDidMount() {
  this.setState({
    name: Session.get("name"),
    email: Session.get("email")
  });
}

http://docs.meteor.com/api/session.html

Answer 2

我能够使用u2622:persistent-session包将数据从第1页的表单传递到第2页的表单。

表格第1页：

<?xml version="1.0"?>
  <Events>
    <Event In="00:00:20:16" Out="00:00:22:24" />
    <Event In="00:00:23:01" Out="00:00:26:07" />
  </Events>

表单第2页：

handleSubmit: function(e){
  Session.setPersistent({name: this.state.name, email: this.state.email});
}

如何使用反应js与meteor js在不同页面中的两个表单（组件）之间传递数据？

2 个答案: