

react-
routerを使っています。そこで質問ですが、下記のDOMでTextFieldにフォーカスした状態でエンターキーを押した時に、Linkをクリックした時と同じアクションつまり(ページ遷移)を起こしたいのですがAPIなどは提供されているのでしょうか。

[code]

      <div>
        <TextField
          floatingLabelText="huga"
          value={this.state.huga}
          onChange={this.onLangChanged}
        /><br />
        <TextField
          floatingLabelText="hoge"
          value={this.state.hoge}
          onChange={this.onPChanged}
        /><br />
        <Link to={link} onClick={this.onSubmitted}>
          <FlatButton label="Show" primary={true} />
        </Link>
        <CodeAppHistory />
      </div>
    
[/code]


CC BY-SA 3.0
2016-05-16T03:55:59.723
24894
2016-06-21T15:33:59.373
7232
question
javascript reactjs
react-routerでエンターキーをおした時ページ遷移したい


react-router には KeyDown 検出の機構はとくにないので、onKeyDown イベントの中で
HistoryAPIを利用してページ遷移するのがよろしいと思います。

ハンドラの例:

[code]

    handleKeyDown(e) {
        if (e.keyCode === 13) { // Enter の場合のみ
            console.log("Enter Key!")
            browserHistory.push("/new_path")
        }
    }
    
[/code]

Textfield の例:

[code]

    <TextField
        floatingLabelText="huga"
        value={this.state.huga}
        onChange={this.onLangChanged}
        onKeyDown={this.handleKeyDown}
    />
    
[/code]


CC BY-SA 3.0
2016-06-21T15:33:59.373
26923
2016-06-21T15:33:59.373
7495
24894
answer