Last active
February 8, 2019 00:47
-
-
Save J-Cake/85ccee29e00e4e36a95681d6eaac0f1b to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import {Appbar, BottomNavigation, Provider as PaperProvider} from 'react-native-paper'; | |
import {Provider, connect} from 'react-redux'; | |
import {createStore} from 'redux'; | |
import Theme from './styles/theme'; | |
import Screens from './screens'; | |
/* | |
{ key: 'Settings', title: 'Settings', icon: 'settings', color: Theme.colors.primary }, //, color: '#00796b' | |
{ key: 'Editor', title: 'Editor', icon: 'edit', color: Theme.colors.primary }, //, color: '#c51162' | |
{ key: 'Calendar', title: 'Calendar', icon: 'perm-contact-calendar', color: Theme.colors.primary }, //, color: '#dca627' | |
{ key: 'Reminders', title: 'Reminders', icon: 'notifications', color: Theme.colors.primary } //, color: '#dca627' | |
*/ | |
const store = createStore(function(state = {token: ""}, action) { | |
switch (action.type) { | |
default: | |
return state; | |
} | |
}); | |
class App extends React.Component { | |
state = { | |
index: 0, | |
routes: [ | |
{ key: 'Login', title: 'Log In', icon: 'vpn-key', color: Theme.colors.primary }, //, color: '#960fee' | |
{ key: 'SignUp', title: 'Sign Up', icon: 'lock-outline', color: Theme.colors.primary }, //, color: '#2962ff' | |
], | |
}; | |
_handleIndexChange = index => this.setState({ index }); | |
_renderScene = BottomNavigation.SceneMap(Screens); | |
render() { | |
return ( | |
<Provider store={createStore()}> | |
<PaperProvider> | |
<Appbar.Header theme={Theme}> | |
<Appbar.BackAction/> | |
<Appbar.Content title="7Days"/> | |
</Appbar.Header> | |
<BottomNavigation | |
navigationState={this.state} | |
onIndexChange={this._handleIndexChange} | |
renderScene={this._renderScene}/> | |
</PaperProvider> | |
</Provider> | |
); | |
} | |
} | |
function mapStateToProps(state) { | |
return { | |
token: state.token | |
} | |
} | |
export default connect(mapStateToProps)(App) | |
// export default App; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import {Appbar, BottomNavigation, Provider as PaperProvider} from 'react-native-paper'; | |
import {Provider, connect} from 'react-redux'; | |
import {createStore} from 'redux'; | |
import Theme from './styles/theme'; | |
import Screens from './screens'; | |
/* | |
{ key: 'Settings', title: 'Settings', icon: 'settings', color: Theme.colors.primary }, //, color: '#00796b' | |
{ key: 'Editor', title: 'Editor', icon: 'edit', color: Theme.colors.primary }, //, color: '#c51162' | |
{ key: 'Calendar', title: 'Calendar', icon: 'perm-contact-calendar', color: Theme.colors.primary }, //, color: '#dca627' | |
{ key: 'Reminders', title: 'Reminders', icon: 'notifications', color: Theme.colors.primary } //, color: '#dca627' | |
*/ | |
const store = createStore(function(state = {token: ""}, action) { | |
switch (action.type) { | |
default: | |
return state; | |
} | |
}); | |
class Main extends React.Component { | |
state = { | |
index: 0, | |
routes: [ | |
{ key: 'Login', title: 'Log In', icon: 'vpn-key', color: Theme.colors.primary }, //, color: '#960fee' | |
{ key: 'SignUp', title: 'Sign Up', icon: 'lock-outline', color: Theme.colors.primary }, //, color: '#2962ff' | |
], | |
}; | |
_handleIndexChange = index => this.setState({ index }); | |
_renderScene = BottomNavigation.SceneMap(Screens); | |
render() { | |
return ( | |
<PaperProvider> | |
<Provider store={createStore()}> | |
<Appbar.Header theme={Theme}> | |
<Appbar.BackAction/> | |
<Appbar.Content title="7Days"/> | |
</Appbar.Header> | |
<BottomNavigation | |
navigationState={this.state} | |
onIndexChange={this._handleIndexChange} | |
renderScene={this._renderScene}/> | |
</Provider> | |
</PaperProvider> | |
); | |
} | |
} | |
function mapStateToProps(state) { | |
return { | |
token: state.token | |
} | |
} | |
export default connect(mapStateToProps)(class App { | |
render() { | |
return ( | |
<Main/> | |
) | |
} | |
}); | |
// export default App; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import {View} from 'react-native'; | |
import {Appbar, BottomNavigation, Provider as PaperProvider} from 'react-native-paper'; | |
import {Provider as ReduxProvider, connect} from 'react-redux'; | |
import {createStore} from 'redux'; | |
import Theme from './styles/theme'; | |
import Screens from './screens'; | |
/* | |
{ key: 'Settings', title: 'Settings', icon: 'settings', color: Theme.colors.primary }, //, color: '#00796b' | |
{ key: 'Editor', title: 'Editor', icon: 'edit', color: Theme.colors.primary }, //, color: '#c51162' | |
{ key: 'Calendar', title: 'Calendar', icon: 'perm-contact-calendar', color: Theme.colors.primary }, //, color: '#dca627' | |
{ key: 'Reminders', title: 'Reminders', icon: 'notifications', color: Theme.colors.primary } //, color: '#dca627' | |
*/ | |
const store = createStore(function(state = {token: ""}, action) { | |
switch (action.type) { | |
default: | |
return state; | |
} | |
}); | |
class Main extends React.Component { | |
state = { | |
index: 0, | |
routes: [ | |
{ key: 'Login', title: 'Log In', icon: 'vpn-key', color: Theme.colors.primary }, //, color: '#960fee' | |
{ key: 'SignUp', title: 'Sign Up', icon: 'lock-outline', color: Theme.colors.primary }, //, color: '#2962ff' | |
], | |
}; | |
_handleIndexChange = index => this.setState({ index }); | |
_renderScene = BottomNavigation.SceneMap(Screens); | |
render() { | |
return ( | |
<PaperProvider> | |
<ReduxProvider store={store}> | |
<Appbar.Header theme={Theme}> | |
<Appbar.BackAction/> | |
<Appbar.Content title="7Days"/> | |
</Appbar.Header> | |
<BottomNavigation | |
navigationState={this.state} | |
onIndexChange={this._handleIndexChange} | |
renderScene={this._renderScene}/> | |
</ReduxProvider> | |
</PaperProvider> | |
); | |
} | |
} | |
function mapStateToProps(state) { | |
return { | |
token: state.token | |
} | |
} | |
export default connect(mapStateToProps)(class App { | |
render() { | |
return ( | |
<View> | |
<Main/> | |
</View> | |
) | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
As app is the root component of the app, you cannot use connect as there is no store in the context above the root component. Change the app class name to something else and then create a new component "App" which you wrap with the store provider. Then connect(mapStateToProps)(otherComponent);