React.js:onClickでComfirm Windowsを表示するサンプルコード

記事公開日:
最終更新日:

This post is also available in: English-US (英語)

React.jsを使って開発していて、onClickをトリガーとしてComfirm Windowsを表示して、Trueの場合(OKをタップした場合)にのみ何かしらの処理を実行するサンプルコードです。

サンプルコード中には javascript ES2015(ES6) の新構文であるアロー関数(Arrow function)を使ってますので、見慣れない方は React.jsでES2015(ES6)のアロー関数(Arrow Function =>)を使えるようにする の記事を参考にしてみてください。

import React from 'react';

export class HandleSomethingData extends React.Component {

    constructor(props) {
        super(props);    
        this.handleData = this.handleData.bind(this);
    }
    
    handleData = () => {
        console.log('Success!!');
    }   

    render() {
        return (
            <div>
             <p>Export Ideas Data</p>
               <Button onClick={() => {if(confirm('Are you OK?')) {this.handleData()};}} >
             </div>
        );//return
    }//render
}//export class

About
Amelt.net,LLCの創業者で、費用対効果の高い統合webマーケティングによりビジネスパートナーとして継続的にサポート。詳しいより。ブログの更新情報TwitterLinkedIn、またRSSfeedlyにてお知らせしていますのでフォローよろしくお願い致します。