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