Showing
7 changed files
with
79 additions
and
53 deletions
... | @@ -5,27 +5,19 @@ import SearchBarContainer from '../SearchBar/SearchBar'; | ... | @@ -5,27 +5,19 @@ import SearchBarContainer from '../SearchBar/SearchBar'; |
5 | import SearchCard from '../SearchCard/SearchCard'; | 5 | import SearchCard from '../SearchCard/SearchCard'; |
6 | 6 | ||
7 | 7 | ||
8 | -class Home extends React.Component { | 8 | +const Home = () => { |
9 | - constructor(props) { | 9 | + return( |
10 | - super(props); | 10 | + <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> |
11 | - this.state = { | 11 | + <SearchBarContainer /> |
12 | - } | 12 | + <SearchCard title={'네이버- 지식인...인간사냥꾼 니달리를ㄴㄴㅁ'} content={'문도 가고 싶은 데로 간다!'} url={'https://www.naver.com'}/> |
13 | - } | 13 | + </View> |
14 | - static navigationOptions={ | ||
15 | - title:'검색', | ||
16 | - tabBarIcon: ({tintColor}) => (<Icon name="search" color={tintColor} style={{marginLeft:2}} size={20} />), | ||
17 | - } | ||
18 | - | ||
19 | - render() { | ||
20 | - return( | ||
21 | - <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> | ||
22 | - <SearchBarContainer /> | ||
23 | - <SearchCard title={'네이버- 지식인...인간사냥꾼 니달리를ㄴㄴㅁ'} content={'문도 가고 싶은 데로 간다!'} url={'https://www.naver.com'}/> | ||
24 | - </View> | ||
25 | - | ||
26 | - ) | ||
27 | - } | ||
28 | 14 | ||
15 | + ) | ||
16 | +} | ||
17 | + | ||
18 | +Home.navigationOptions={ | ||
19 | + title:'검색', | ||
20 | + tabBarIcon: ({tintColor}) => (<Icon name="search" color={tintColor} style={{marginLeft:2}} size={20} />), | ||
29 | } | 21 | } |
30 | 22 | ||
31 | export default Home; | 23 | export default Home; |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -3,7 +3,7 @@ import AppTabContainer from '../AppTabContainer/AppTabContainer'; | ... | @@ -3,7 +3,7 @@ import AppTabContainer from '../AppTabContainer/AppTabContainer'; |
3 | import Loading from '../Loading/Loading'; | 3 | import Loading from '../Loading/Loading'; |
4 | import { connect } from 'react-redux'; | 4 | import { connect } from 'react-redux'; |
5 | 5 | ||
6 | -const Main = ({ isLoading, toggleLoading}) => { | 6 | +const Main = ({ isLoading}) => { |
7 | if ( isLoading ) { | 7 | if ( isLoading ) { |
8 | return( | 8 | return( |
9 | <> | 9 | <> |
... | @@ -24,6 +24,6 @@ const MainContainer = ({isLoading}) => { | ... | @@ -24,6 +24,6 @@ const MainContainer = ({isLoading}) => { |
24 | return(<Main isLoading={isLoading} />) | 24 | return(<Main isLoading={isLoading} />) |
25 | } | 25 | } |
26 | 26 | ||
27 | -const mapStateToProps = (state) => ({isLoading : state.ToggleLoading.isLoading}) | 27 | +const mapStateToProps = (state) => ({isLoading : state.loading.isLoading}) |
28 | 28 | ||
29 | export default connect(mapStateToProps)(MainContainer); | 29 | export default connect(mapStateToProps)(MainContainer); |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -2,27 +2,17 @@ import React from 'react'; | ... | @@ -2,27 +2,17 @@ import React from 'react'; |
2 | import { View, Text} from 'react-native'; | 2 | import { View, Text} from 'react-native'; |
3 | import Icon from 'react-native-vector-icons/FontAwesome'; | 3 | import Icon from 'react-native-vector-icons/FontAwesome'; |
4 | 4 | ||
5 | -class Rate extends React.Component { | 5 | +const Rate = () => { |
6 | - constructor(props) { | 6 | + return( |
7 | - super(props); | 7 | + <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> |
8 | - this.state = { | 8 | + <Text >평가</Text> |
9 | - | 9 | + </View> |
10 | - } | 10 | + ) |
11 | - } | 11 | +} |
12 | - | ||
13 | - static navigationOptions={ | ||
14 | - title:'평가', | ||
15 | - tabBarIcon: ({tintColor})=> (<Icon name="bar-chart-o" color={tintColor} style={{marginLeft:0.5}} size={20} />), | ||
16 | - } | ||
17 | 12 | ||
18 | - render() { | 13 | +Rate.navigationOptions={ |
19 | - return( | 14 | + title:'평가', |
20 | - <View style={{flex: 1, backgroundColor:'#eee', margin:0,padding:0}}> | 15 | + tabBarIcon: ({tintColor})=> (<Icon name="bar-chart-o" color={tintColor} style={{marginLeft:0.5}} size={20} />), |
21 | - <Text >평가</Text> | ||
22 | - </View> | ||
23 | - ) | ||
24 | - } | ||
25 | - | ||
26 | } | 16 | } |
27 | 17 | ||
28 | export default Rate; | 18 | export default Rate; |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -2,8 +2,17 @@ import React from 'react'; | ... | @@ -2,8 +2,17 @@ import React from 'react'; |
2 | import {View,Alert} from 'react-native'; | 2 | import {View,Alert} from 'react-native'; |
3 | import { Searchbar } from 'react-native-paper'; | 3 | import { Searchbar } from 'react-native-paper'; |
4 | import { connect } from 'react-redux'; | 4 | import { connect } from 'react-redux'; |
5 | -import {toggleLoading} from '../../reducers/ToggleLoading'; | 5 | +import {toggle} from '../../reducers/loading'; |
6 | 6 | ||
7 | +const voiceRecognition=()=>{ | ||
8 | + Alert.alert( | ||
9 | + '음성 인식', | ||
10 | + '아직 구현 못함', | ||
11 | + [ | ||
12 | + {text: '확인', onPress: () => {}}, | ||
13 | + ], | ||
14 | + ) | ||
15 | +} | ||
7 | 16 | ||
8 | class SearchBar extends React.Component { | 17 | class SearchBar extends React.Component { |
9 | constructor(props){ | 18 | constructor(props){ |
... | @@ -42,7 +51,7 @@ class SearchBar extends React.Component { | ... | @@ -42,7 +51,7 @@ class SearchBar extends React.Component { |
42 | onChangeText={this.queryChange} | 51 | onChangeText={this.queryChange} |
43 | value={this.state.query} | 52 | value={this.state.query} |
44 | icon='microphone' | 53 | icon='microphone' |
45 | - onIconPress={this.voiceRecognition} | 54 | + onIconPress={voiceRecognition} |
46 | onSubmitEditing={this.submit} | 55 | onSubmitEditing={this.submit} |
47 | /> | 56 | /> |
48 | </View> | 57 | </View> |
... | @@ -51,10 +60,10 @@ class SearchBar extends React.Component { | ... | @@ -51,10 +60,10 @@ class SearchBar extends React.Component { |
51 | } | 60 | } |
52 | } | 61 | } |
53 | 62 | ||
54 | -const SearchBarContainer = ({toggleLoading}) => { | 63 | +const SearchBarContainer = ({toggle}) => { |
55 | - return(<SearchBar toggleLoading={toggleLoading} />) | 64 | + return(<SearchBar toggleLoading={toggle} />) |
56 | } | 65 | } |
57 | 66 | ||
58 | -const mapDispatchToProps = (dispatch) => ({toggleLoading : ()=>{ dispatch( toggleLoading() )}}); | 67 | +const mapDispatchToProps = (dispatch) => ({toggle : ()=>{ dispatch( toggle() )}}); |
59 | 68 | ||
60 | export default connect(null,mapDispatchToProps)(SearchBarContainer); | 69 | export default connect(null,mapDispatchToProps)(SearchBarContainer); |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | import { createStore, combineReducers } from 'redux'; | 1 | import { createStore, combineReducers } from 'redux'; |
2 | -import ToggleLoading from './ToggleLoading' | 2 | +import loading from './loading' |
3 | 3 | ||
4 | -const store = combineReducers({ ToggleLoading }); | 4 | +const store = combineReducers({ loading }); |
5 | 5 | ||
6 | export default createStore(store) | 6 | export default createStore(store) |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | -const TOGGLE_LOADING = 'ToggleLoading/TOGGLE'; | 1 | +const TOGGLE = 'loading/TOGGLE'; |
2 | 2 | ||
3 | -export const toggleLoading = () => ({ type: TOGGLE_LOADING,}) | 3 | +export const toggle = () => ({ type: TOGGLE,}) |
4 | 4 | ||
5 | const initialState = { | 5 | const initialState = { |
6 | isLoading: false, | 6 | isLoading: false, |
7 | }; | 7 | }; |
8 | 8 | ||
9 | -export default ToggleLoading = (state = initialState, action) => { | 9 | +export default loading = (state = initialState, action) => { |
10 | switch (action.type) { | 10 | switch (action.type) { |
11 | - case TOGGLE_LOADING: | 11 | + case TOGGLE: |
12 | return {...state, isLoading: !state.isLoading }; | 12 | return {...state, isLoading: !state.isLoading }; |
13 | default: | 13 | default: |
14 | return state; | 14 | return state; | ... | ... |
searchGuide/reducers/search.js
0 → 100644
1 | +const CHANGE = 'search/CHANGE'; | ||
2 | +const SUBMIT = 'search/SUBMIT'; | ||
3 | + | ||
4 | +export const change = (text) => ({ | ||
5 | + type: CHANGE, | ||
6 | + text, | ||
7 | +}) | ||
8 | + | ||
9 | +export const submit = (text) => ({ | ||
10 | + type: CHANGE, | ||
11 | + text, | ||
12 | +}) | ||
13 | + | ||
14 | +const initialState = { | ||
15 | + query: '', | ||
16 | + searchResult:{}, | ||
17 | +}; | ||
18 | + | ||
19 | +export default ToggleLoading = (state = initialState, action) => { | ||
20 | + switch (action.type) { | ||
21 | + case CHANGE: | ||
22 | + return {...state, query: action.text}; | ||
23 | + case SUBMIT: | ||
24 | + return {...state, query: ''} | ||
25 | + default: | ||
26 | + return state; | ||
27 | + } | ||
28 | +} | ||
29 | + | ||
30 | +submit=()=>{ | ||
31 | + this.props.toggleLoading(); | ||
32 | + setTimeout(()=>{this.props.toggleLoading()},1000); | ||
33 | + this.setState({query:''}); | ||
34 | +} | ||
35 | + |
-
Please register or login to post a comment