MultiSelect in reactネイティブ

Question

私は、反応したネイティブでMultiSelectを実装しようとしています。私はこのリンク「https://github.com/toystars/react-native-multiple-select」から引用しました。しかし、残念ながら私は で、表示する項目がないことを示すドロップダウンリストに名前を表示できません。

画像：ドロップダウンで表示される名前についてhttps://i.stack.imgur.com/c11Jx.jpg

、データは、オブジェクトのJavaScriptの配列の形式であるべきプロプアイテムから取り出されます。この問題を解決するために私を助けてください。

`import React, {Component} from 'react'; 
import { SectionList, Image, StyleSheet, Text, View, ScrollView, ListView, 
AsyncStorage, Button, TextInput, TouchableOpacity, KeyboardAvoidingView } 
from 'react-native'; 
import { Constants } from 'expo'; 
import ActionButton from 'react-native-action-button'; 
import Icon from 'react-native-vector-icons/Ionicons'; 
import { StackNavigator } from 'react-navigation'; 
import { Ionicons } from '@expo/vector-icons'; 
import TextField from 'react-native-md-textinput'; 
import MultiSelect from 'react-native-multiple-select'; 

export default class SendNotification extends Component { 

static navigationOptions = { 
    title: 'Send Notification', 
}; 

constructor (props) { 
super(props) 
this.state = { 
    arr_user: [],   
} 
} 

componentWillMount() { 
this.getUsers(); 
}; 

getUsers = async() => { 
const { page, seed } = this.state; 
await fetch('.....api') 
    .then((response) => response.json()) 
    .then((responseJson) => { 

    this.setState({arr_user: responseJson.results}); 

    }).catch((error) => { console.error(error); }); 


}; 

focus() { 
this.textInput && this.textInput.focus() 
}; 

onSelectedItemsChange = (selectedItems) => { 

console.log(JSON.stringify(selectedItems)); 
this.setState({selected_user: JSON.stringify(selectedItems)}); 
}; 

render() { 

    return (

    <View style={{flex:1, backgroundColor:'#ffffff'}}> 

     <ScrollView> 

     <MultiSelect 
      items={this.state.arr_user} 
      uniqueKey="id" 
      onSelectedItemsChange={this.onSelectedItemsChange} 
      selectedItems={[]} 
      selectText="Pick Users" 
      searchInputPlaceholderText="Search Users..." 
      tagRemoveIconColor="#CCC" 
      tagBorderColor="#CCC" 
      tagTextColor="#CCC" 
      selectedItemTextColor="#CCC" 
      selectedItemIconColor="#CCC" 
      itemTextColor="#000" 
      searchInputStyle={{ color: '#CCC' }} 
      submitButtonColor="#CCC" 
      submitButtonText="Submit" 
     /> 

     </ScrollView> 
    </View> 

    ); 
    } 
} ` 

Answer 1

async/awaitと "classic"（fetch）約束の構文を混同していませんか？だからではなく、

await fetch(YOUR_API) 
.then((response) => response.json()) 
.then((responseJson) => ... 

を書くのあなたはそうしないと、あなたの（フェッチを書くことができ

... async() => { 
    const { page, seed } = this.state; 
     try { 
     const response = await fetch('..//api'); 
     const responseJson = await response.json(); 
     [DO CONDITIONAL CHECKS IF NEEDED] 
     this.setState({ arr_user: responseJson }); 
     } catch (e) { 
     console.log(e); 
     } 
} 

を書く必要があります）、より古典的な方法が、非同期/のawait WASに を「非同期/待つ」いくつかの便利な導入なしこの記事で私に：6 Reasons Why JavaScript’s Async/Await Blows Promises Away (Tutorial)