无法在 redux store 中存储数据 - 刷新页面后数据消失
Unable to store data in redux store -Data disappears after refreshing the page
我是 react-native 的新手,正在学习 react-redux。我去了一个网站并复制了确切的代码。该代码不存储电子邮件和密码的值。当我刷新页面时,所有数据都消失了。任何人都可以帮助我将数据持久保存在 redux-store 中吗?任何帮助将不胜感激。
这是我的 App.js
import React from 'react';
import { Provider } from 'react-redux';
import store from '../redux/store';
import Form from './components/Form';
export default function App() {
return (
<Provider store={store}>
<Form />
</Provider>
);
}
还有我的Form.js
import React from 'react';
import { View, Button, TextInput, StyleSheet } from 'react-native';
import { Field, reduxForm } from 'redux-form';
const Form = (props) => {
const { handleSubmit } = props;
const onSubmit = (values) => console.log(values);
const renderInput = ({ input: { onChange, ...input }, ...rest}) => {
return <TextInput style={styles.input} onChangeText={onChange} {...input} {...rest} />
};
return (
<View style={styles.root}>
<Field
name={'email'}
props={{
placeholder: 'Email'
}}
component={renderInput}
/>
<Field
name={'password'}
props={{
placeholder: 'Password',
secureTextEntry: true
}}
component={renderInput}
/>
<Button title={'Submit'} onPress={handleSubmit(onSubmit)} />
</View>
);
};
const styles = StyleSheet.create({
root: {
flex: 1,
padding: 32,
justifyContent: 'center'
},
input: {
padding: 8,
marginBottom: 8,
borderColor: 'blue',
borderWidth: 1,
borderRadius: 4
}
});
export default reduxForm({form: 'test-form'})(Form);
我的store.js
import {combineReducers, createStore} from 'redux';
import {reducer as formReducer} from 'redux-form';
const rootReducer = combineReducers({
form: formReducer
});
const store = createStore(rootReducer);
export default store;
要保存您的数据,您需要使用 redux-persist
。
这里是Github link
我是 react-native 的新手,正在学习 react-redux。我去了一个网站并复制了确切的代码。该代码不存储电子邮件和密码的值。当我刷新页面时,所有数据都消失了。任何人都可以帮助我将数据持久保存在 redux-store 中吗?任何帮助将不胜感激。 这是我的 App.js
import React from 'react';
import { Provider } from 'react-redux';
import store from '../redux/store';
import Form from './components/Form';
export default function App() {
return (
<Provider store={store}>
<Form />
</Provider>
);
}
还有我的Form.js
import React from 'react';
import { View, Button, TextInput, StyleSheet } from 'react-native';
import { Field, reduxForm } from 'redux-form';
const Form = (props) => {
const { handleSubmit } = props;
const onSubmit = (values) => console.log(values);
const renderInput = ({ input: { onChange, ...input }, ...rest}) => {
return <TextInput style={styles.input} onChangeText={onChange} {...input} {...rest} />
};
return (
<View style={styles.root}>
<Field
name={'email'}
props={{
placeholder: 'Email'
}}
component={renderInput}
/>
<Field
name={'password'}
props={{
placeholder: 'Password',
secureTextEntry: true
}}
component={renderInput}
/>
<Button title={'Submit'} onPress={handleSubmit(onSubmit)} />
</View>
);
};
const styles = StyleSheet.create({
root: {
flex: 1,
padding: 32,
justifyContent: 'center'
},
input: {
padding: 8,
marginBottom: 8,
borderColor: 'blue',
borderWidth: 1,
borderRadius: 4
}
});
export default reduxForm({form: 'test-form'})(Form);
我的store.js
import {combineReducers, createStore} from 'redux';
import {reducer as formReducer} from 'redux-form';
const rootReducer = combineReducers({
form: formReducer
});
const store = createStore(rootReducer);
export default store;
要保存您的数据,您需要使用 redux-persist
。
这里是Github link