OrgView 변경

WeConnection · Aug 13, 2020 · 5d7aa80 · 5d7aa80
1 parent 3575232
commit 5d7aa80
Showing 1 changed file with 21 additions and 40 deletions.
diff --git a/compo/orgview.js b/compo/orgview.js
@@ -1,6 +1,6 @@
 import AsyncStorage from '@react-native-community/async-storage';
 import React, {useState, useEffect} from 'react';
-import { ScrollView, Text, View, Image, TouchableHighlight, useWindowDimensions, Alert } from 'react-native';
+import { FlatList, Text, View, Image, TouchableHighlight, useWindowDimensions, Alert } from 'react-native';
 import {hostaddr} from '../config'
 
 const OrgIcon = (props) => {
@@ -23,49 +23,17 @@ const OrgIcon = (props) => {
 const OrgView = () => {
  const width = useWindowDimensions().width;
  const fit = parseInt(width / 120);
- const [contents, setContents] = useState([]);
+ const [orgs, setOrgs] = useState([]);
  const [loading, setLoading] = useState(true);
 
- const getContents = (orgs) => {
- const count = orgs.length;
- let contents = [];
-
- for(let i = 0; i < count / fit; i++)
- {
- let row = [];
- for(let j = 0; (j < fit) && (i * fit + j < count); j++)
- {
- row.push(<OrgIcon key={j.toString()} name={orgs[i * fit + j].name} tags={orgs[i * fit + j].tags} style={{
- marginHorizontal: 20,
- alignItems: 'center',
- }} />);
- }
-
- contents.push(
- <View style={{
- flex: 1,
- flexDirection: 'row',
- alignItems: 'center',
- marginHorizontal: 5,
- marginVertical: 20,
- }} key={i.toString()}>
- {row}
- </View>
- );
- }
-
- return contents;
- };
-
  useEffect(() => {
  setLoading(true);
  fetch(hostaddr + '/org/list', {
  method: 'GET',
  })
  .then(res => res.json())
  .then(json => {
- const orgs = json['orgs'];
- setContents(getContents(orgs));
+ setOrgs(json['orgs']);
  })
  .catch(err => {
  Alert.alert(
@@ -79,22 +47,35 @@ const OrgView = () => {
  ],
  {cancelable: false},
  );
- AsyncStorage.setItem('username', '').then(() => navigation.navigate('Login'));
+ AsyncStorage.setItem('username', '');
  })
  .finally(() => {
  setLoading(false);
  });
  }, []);
 
  return (
- <ScrollView style={{
+ <View style={{
  flex: 1,
- flexDirection: 'column',
+ alignItems: 'center',
  marginHorizontal: 20,
  marginVertical: 10,
  }}>
- {loading ? <Text>로딩중</Text> : contents}
- </ScrollView>
+ {loading ? <Text>로딩중</Text> : 
+ <FlatList 
+ data={orgs}
+ renderItem={({item}) => 
+ <OrgIcon 
+ name={item.name}
+ style={{
+ alignItems: 'center',
+ marginVertical: 10,
+ marginHorizontal: 20,
+ }}
+ />}
+ numColumns={fit}
+ />}
+ </View>
  );
 };