Question

我是本机和学习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;

Answer 1

要保留数据，您需要使用redux-persist。

这是Github link

无法在Redux存储中存储数据-刷新页面后数据消失

1 个答案: