MultiSelect in react 네이티브

Question

네이티브로 반응하는 MultiSelect를 구현하려고합니다. 나는이 링크 "https://github.com/toystars/react-native-multiple-select"에서 언급했다. 하지만 불행히도 나는 "표시 할 항목이 없습니다"를 보여주는 드롭 다운 목록에서 이름을 볼 수 없습니다.

화상

: https://i.stack.imgur.com/c11Jx.jpg

이름 드롭에 표시 될 내용은 데이터 항목에서 자바 스크립트 객체의 어레이의 형태로 있어야하는 소품 취해진 다. 이 문제를 해결하기 위해 나를 도우십시오.

`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) => ... 

을 쓰는 당신은 당신이 "/ 비동기 기다리고 있습니다") (더 고전적인 방법이지만없이 가져올 당신의 쓰기 비동기/await를 WAS에 일부 유용한 소개를 할 수

그렇지 않으면

... 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); 
     } 
} 

작성해야 이 기사 : 6 Reasons Why JavaScript’s Async/Await Blows Promises Away (Tutorial)