react native 数据缓存的保存和获取

React Native 版本执行0.57的规则

开发票页面，刚开始的初衷是完全应用state状态存储，但是后期测试发现，会把错误的信息传递出去，因为输入框发生变化就会把数据保存下来，当点击页面的返回按钮，就会把错误的数据带出去

import React, {
    Component } from 'react';
import {
    StyleSheet, Text, View, ScrollView, Image, TextInput, TouchableOpacity, StatusBar } from 'react-native';
import Nav from '../../components/Nav';
import {
    regExp } from "../../network/RegExp"
import Px2dp from '../../utils/Px2dp';
import LinearGradient from 'react-native-linear-gradient'; //按钮渐变
import * as DataBase from '../../utils/Public'

export default class CreateInvoicing extends Component {
   
    constructor(props) {
   
        super(props);
        this.state = {
   
            isLoading: false,
            invoicingBoxArr: [
                {
   
                    'name': "不开发票",
                    'invoicetype': "0",
                },
                {
   
                    'name': "开发票",
                    'invoicetype': '',
                }
            ],
            personCompanyArr: [
                {
   
                    'name': "个人",
                    'invoicetype': "1",
                },
                {
   
                    'name': "公司",
                    'invoicetype': "2",
                }
            ],
            invoice: {
   
                "invoicetype": "0",// 发票类型 0不开 1个人 2公司
                "taitou": "",// 发票taitou
                "shibiehao": "",// 发票识别码 
            },// 发票信息 
            visiable: false, //是否删除缓存
            invoicingIndex: 0,
            personCompanyIndex: 0,
        }
    }
    componentWillMount() {
   
        // 下单页面传过来的发票信息
        if (this.props.navigation.state.params) {
   
            this.setState({
   
                invoice: this.props.navigation.state.params.invoice
            })
            console.log(this.props.navigation.state.params.invoice)
        }
    }
    componentDidMount() {
   
        //返回数据==渲染发票个人信息
        if (this.state.invoice.invoicetype == "1") {
   
            this.setState({
   
                invoicingIndex: 1,
                personCompanyIndex: 0
            })
        }
        else if (this.state.invoice.invoicetype == "2") {
    //返回数据==渲染发票公司信息
            this.setState({
   
                invoicingIndex: 1,
                personCompanyIndex: 1
            })
        }
    }
    render() {
   
        const {
    navigate, goBack } = this.props.navigation;
        return (
            <View style={
   styles.container}>
                <StatusBar
                    animated={
   true}//是否动画
                    hidden={
   false}//是否隐藏
                    backgroundColor={
   '#000'}//android 设置状态栏背景颜色
                    translucent={
   false}//android 设置状态栏是否为透明
                    showHideTransition="fade"//IOS状态栏改变时动画 fade:默认 slide
                    networkActivityIndicatorVisible={
   this.state.isLoading}//IOS设定网络活动指示器(就是那个菊花)是否显示在状态栏。
                    statusBarStyle={
   "default"}//状态栏样式 default	默认（IOS为白底黑字、Android为黑底白字）
                    barStyle={
   "default"}// 状态栏文本的颜色。
                />
                <Nav title={
   "开具发票"} leftClick={
   () => {
   
                    //是否删除缓存
                    if (this.state.visiable) {
   
                        DataBase.removeItem("invoice");
                        goBack()
                    }
                    else {
   
                        DataBase.getItem("invoice").then(data => {
   
                            let newData = data
                            console.log(data)
                            if (data == null) {
   
                                if (this.state.invoice.invoicetype == "1") {
   
                                    newData = {
   
                                        "invoicetype": "1",// 发票类型