React Native 状态管理可以通过多种方式实现，其中最常用的是使用 Redux 或 React Navigation 等库。以下是一个简单的 Redux 状态管理的例子：
首先，安装 Redux：
npm install redux react-redux
然后，创建一个 Redux store：
// store.js
import { createStore } from 'redux';
// 定义一个简单的reducer
const initialState = { count: 0 };
const reducer = (state = initialState, action) => {
switch (action.type) {
case 'INCREMENT':
return { count: state.count + 1 };
case 'DECREMENT':
return { count: state.count - 1 };
default:
return state;
}
};
const store = createStore(reducer);
export default store;
接着，使用 Provider 组件在根组件外围包裹应用，以及 connect 高阶组件连接状态和动作到组件：
// App.js
import React from 'react';
import { Provider } from 'react-redux';
import store from './store';
const App = () => (
<Provider store={store}>
{/* 你的应用组件 */}
</Provider>
);
export default App;
// CounterComponent.js
import React, { Component } from 'react';
import { View, Text, Button } from 'react-native';
import { connect } from 'react-redux';
class CounterComponent extends Component {
render() {
return (
<View>
<Text>{this.props.count}</Text>
<Button onPress={this.props.increment} title="Increment" />
<Button onPress={this.props.decrement} title="Decrement" />
</View>
);
}
}
const mapStateToProps = (state) => ({
count: state.count,
});
const mapDispatchToProps = (dispatch) => ({
increment: () => dispatch({ type: 'INCREMENT' }),
decrement: () => dispatch({ type: 'DECREMENT' }),
});
export default connect(mapStateToProps, mapDispatchToProps)(CounterComponent);
在这个例子中，我们创建了一个简单的计数器应用，展示了如何使用 Redux 管理状态。通过 mapStateToProps 和 mapDispatchToProps 函数，我们将 store 中的状态和动作分别传递给组件的 props，使得组件可以读取状态和触发动作。