Эй, я читал онлайн-уроки по редуксу. Я изучил то, что я понимаю из учебных пособий, теперь я хочу изменить состояние различных начальных состояний, которые я установил, я кодировал редуктор, действие и причину накопления, Я читал в учебнике, но я не знаю, как изменить состояния в моих компонентах на основе действий и редукторов, которые я установил, например, если я хочу сделать home
ложным, я написал falseHome
действие, которое сделает это, но я не знаю, как использовать это в моих компонентах, например, я хочу изменить состояние дома при навигации, используя falseHome, любая помощь будет оценена, я здесь, чтобы узнать, спасибо.
**STORE\INDEX.JS**
import { createStore } from "redux";
import rootReducer from "../reducers/index";
const store = createStore(rootReducer);
export default store;
**REDUCERS\INDEX.JS**
import{TRUE_HOME, TRUE_BROWSE,
TRUE_CART, TRUE_MESSAGES,
TRUE_SERVICES, FALSE_BROWSE,
FALSE_CART, FALSE_HOME, FALSE_MESSAGES,
FALSE_SERVICES} from "../constants/action-types";
const initialState = {
messages: false,
home: true,
browse: false,
cart: false,
services: true
};
const rootReducer = (state = initialState, action) => {
switch (action.type){
case TRUE_HOME:
return{
...state,
home: true
};
case FALSE_HOME:
return{
...state,
home: false
};
case TRUE_BROWSE:
return{
...state,
browse: true
};
case FALSE_BROWSE:
return{
...state,
browse: false
};
case TRUE_MESSAGES:
return{
...state,
messages: true
};
case FALSE_MESSAGES:
return{
...state,
messages: false
};
case TRUE_CART:
return{
...state,
cart: true
};
case FALSE_CART:
return{
...state,
cart: false
};
case TRUE_SERVICES:
return{
...state,
services: true
};
case FALSE_SERVICES:
return{
...state,
services: false
};
default:
return state
}
}
export default rootReducer;
**ACTIONS\INDEX.JS**
import{TRUE_HOME, TRUE_BROWSE,
TRUE_CART, TRUE_MESSAGES,
TRUE_SERVICES, FALSE_BROWSE,
FALSE_CART, FALSE_HOME, FALSE_MESSAGES,
FALSE_SERVICES} from "../constants/action-types";
export const trueHome = home => ({type:
"TRUE_HOME", home: true
});
export const falseHome = home => ({type:
"FALSE_HOME", home: false
});
export const falseBrowse = browse =>({type:
"FALSE_BROWSE", browse: false
});
export const trueBrowse = browse => ({type:
"TRUE_BROWSE", browse: true
});
export const trueMessages = messages => ({type:
"TRUE_MESSAGES", messages: true
});
export const falseMessages = messages => ({type:
"FALSE_MESSAGES", messages: false
});
export const trueCart = cart => ({type:
"TRUE_CART", cart: true
});
export const falseCart = cart => ({type:
"FALSE_CART", cart: false
});
export const trueServices = services => ({type:
"TRUE_SERVICES", services: true
});
export const falseServices = services => ({type:
"FALSE_SERVICES", services: false
});
APP.JS
import store from "./store/index";
import { connect, Provider } from 'react-redux';
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
timePassed: false,
On: true,
};
}
render() {
setTimeout(() => {
this.setState({timePassed: true})
}, 500);
if (!this.state.timePassed) {
return <View style={{flex: 1}}>
<StatusBar backgroundColor='transparent' translucent={true} barStyle='light-content'/><Splash/></View>;
} else {
return (
<View style={styles.container}>
<Provider store={store}>
<RootStack/>
</Provider>
</View>
);
}
}
}
ДЕТСКИЙ КОМПОНЕНТ ДЛЯ ИСПОЛЬЗОВАНИЯ ДЕЙСТВИЙ И УСТАНОВЛЕНИЯ ГОСУДАРСТВА
//but i don't know how to use the action
import { connect } from "react-redux";
<TouchableNativeFeedback onPress={() =>
props.navigation.navigate('Shop', {falseHome})}>