RNは、無線機能を達成するために

ラジオは、コードワードに直接実装アントデザインモバイルRNライブラリーを用いた無線機能は話すことはありません。

1、引入 'ANT-設計/反応ネイティブ@' からインポート{ラジオ}。

2、ステートメントのconst RadioItem = Radio.RadioItem。

3、の状態

=州{ 
        bidDocId： 0、// チェックデータ 
        selIndex：0、// インデックスを選択 
    }。

4、達成するためにマップを使用して

//   使用マップ实现单选
    プライベートSHOWMAP（）{ 
        ましょうデータリスト：任意[] = この.state.data
         場合（データリスト&& dataList.length）{ 

            戻り dataList.map（（項目、指数）=> {
                 リターン（
                     < RadioItem 
                        キー = {索引} 
                        スタイル = {{高さ：70 }} 
                        チェック = { この .state.selIndex === インデックス} 
                        のonChange = {（イベント：任意）=> {
                            // 選択した更新データであれば
                            IF （event.target.checked）{
                                 この.setState（{selIndex：インデックス}）;
                                 この .state.bidDocId = item.bidDocId 
                            } 
                        }}
                     > 
                        { / * カスタム* / }
                         <スタイル= {{フレックス表示:. 1、paddingVertical：15、flexDirection： '列'}}> 
                            < SelBidderView 
                                bidderHeadImg = {} item.iconUrl 
                                bidderName ={item.userName}
                             /> 
                        </表示> 
                    </ RadioItem>                 ）。
            }）
        } 
    }

5.無線機を使用して実装FlatList

//   使用FlatListは、各データは、複数の選択肢のCPC同様のネイティブ実装の値を更新し（checkedflag）を結合し、のための無線タグを実現
    プライベートshowFlatListを（）{ 
        LETのデータリスト = この.state.data
         IF（データリスト&& データリスト。長さ）{ 
            CONST extraUniqueKey =（）=> Math.random（）のtoString（）;. 
            CONST renderAssertItem =（レンダリング：IBaseRenderItem <任意>）=> {
                 リターン（
                     <表示> 
                        < RadioItem 
                            チェック = {} render.item.checkedflag 
                            onChange = {（イベント：任意）=>{
                                 場合（event.target.checked）{ 

                                    ODATAを聞かせ：任意 = この.state.data。

                                    オンユてみましょう：任意の[] = []; 
                                    oData.map（（fItem：任意） => {
                                         場合（render.item.userId === fItem.userId）{ 
                                            fItem.checkedflag = 真;
                                             この .state.bidDocId = fItem.bidDocId 
                                        } 
                                        さもなければ{ 
                                            fItem.checkedflag = 偽。
                                        } 

                                        oNew.push（fItem）。
                                    }）; 

                                    この.setState（{データ：オンユ}）。

                                } 
                            }}
                         > 
                            <ビュースタイル= {{marginVertical：15}}> 
                                < SelBidderView 
                                    bidderHeadImg = {render.item.iconUrl} 
                                    bidderName =render.item.userName} {
                                 /> 
                            </表示> 

                        </ RadioItem> 

                    </ビュー> 
                ）
            } リターン（ < FlatList
                     // データバインディング 
                    データ= {データリスト}
                     // リスト表示制御 
                    のRenderItem = {} renderAssertItem 
                    keyExtractor = { } extraUniqueKey
                 />
 
            ）; 
        } 
    }