2017年01月06日

Stateless Functionでrefを利用する

Stateless Functionではrefsへの参照を生成しないため以下のようにして要素の内容を取得する

一度、ローカル変数に参照を入れておき、それを参照して取得する。

import React from 'react';
import ReactDOM from 'react-dom';

const Component = () =>{
let input;
const handleClick = () =>{
console.log(input.value);
}
return (
<div>
<input type="text" ref={e=>input=e}/>
<input type="button" value="click" onClick={handleClick}/>
</div>
)
};
//コンポーネントの描画
ReactDOM.render(
<Component />,
document.getElementById('root')
);


参考:Refs and the DOM - React
タグ:REACT
posted by ねこまんま at 17:15 | Comment(0) | TrackBack(0) | React | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。
この記事へのトラックバックURL
http://blog.seesaa.jp/tb/445632724
※ブログオーナーが承認したトラックバックのみ表示されます。

この記事へのトラックバック