ReactJs Temel Yaklaşım
  • Başlangıç
  • Ortam Hazırlığı
  • Merhaba Dunya - Webpack
  • Arayüz Hazırlığı - UI
  • Çoklu Component
  • Props
  • State
  • SetState
  • If, Else, Switch Örnekleri
  • Form Kullanım Örnekleri
Powered by GitBook
On this page

Was this helpful?

If, Else, Switch Örnekleri

React genel anlamda bir dom biçimlendiricisi denilebilir. Bir kaç farklı operatör pratiğini belirtmekte fayda var.

bir tab örneği

    constructor(props) {
        super(props)
        this.state = { activeTab: 2 };
    }

       return (

            <div>
                <div className="mdl-card mdl-shadow--1dp m-b-30">
                    <div className="mdl-card__title">
                        <Tabs activeTab={this.state.activeTab} onChange={(tabId) => this.setState({ activeTab: tabId })} ripple>
                            <Tab>Stats</Tab>
                            <Tab>Location</Tab>
                            <Tab>Setting</Tab>
                        </Tabs>
                    </div>
                    <div className="demo-tabs">

                        <section>
                            <div className="content">
                            //if, else 
                                 {  this.state.activeTab === 2 ?  <AddCampaignForm /> : <StatsBoard /> }
                             //if, else
                                {content}
                            </div>
                        </section>
                    </div>
                </div>
            </div>
        );

bir değişken kullanarak

        let content = null;
        const istab = this.state.activeTab;
        if (istab == 1) {
            content = <AddCampaignForm />;
        } else {
            content = "peh";
        }

bir switch yapısı ile

    switch (this.state.activeTab) {
        case 1:
            return <AddCampaignForm />
            break;
        case 2:
            return <AddCampaignForm2 />
            break;
        case 3:
            return <AddCampaignForm3 />
            break;
        default: null
    }

daha fazlası için

PreviousSetStateNextForm Kullanım Örnekleri

Last updated 5 years ago

Was this helpful?

http://reactjs.cn/react/tips/if-else-in-JSX.html
https://www.npmjs.com/package/jsx-control-statements