如果实现一个应用关闭后重新进入时恢复关闭前的状态?

昨天才做了个还热乎的项目,一个客户的需求是做一款获取随机值的安卓app应用。

结合我熟悉的技术栈很自然选择使用Taro框架生成H5应用,并使用现成的工具来打包成安卓应用。

业务逻辑很普通,但是有一个需求挺特别。客户要求任何时候退出应用,再进去也要保持退出时候的样子。并且客户还希望这就是一个本地应用,无需联网请求网络数据。

那很自然,这需要用到h5的localstorage能力,并且应用需要有一个机制维护每一时刻的数据状态(这与redux的机制很一致,不过没必要在打苍蝇用上机关枪)。在经过短暂的一些实践后,我得出了需要实现如此的退出后重新进入能恢复退出前的样子即状态的基础是:

Taro框架使用的是类React语法,状态的更新调用setState方法,这是一个异步函数并且该函数还接收第二个参数:当状态完成更新后执行的回调函数。

于是结合需求可以在每一次执行状态更新时,需要传递一个异步方法,在方法里将更新后的应用的全局状态存储到本地中。

this.setState({
    //更新状态
},()=>{
    Taro.setStorageSync('state',this.state)
})

在生成H5应用后,Taro.setStorageSync会编译成h5的本地存储方法storage.setItem。这样每一次的状态更新,应用就存储当前的状态,这相当于我们编辑文档时的系统自动存储功能。那怎么在应用退出后重新进入时恢复到退出前的状态呢?

这就需要应用打开时执行一次获取最新的本地存储里的全局状态并更新到应用状态上就可以了。

该方法最合适写在生命周期componentWillMount函数上:

componentWillMount(){
    let state = Taro.getStorageSync('state')
    if(state){
        this.setState(state)
    }
}

至此,两个关键的代码就实现了客户的需求。这个应用的状态相对还是比较简单的(一共10个key值),性能还不会遇到瓶颈。如果应用要管理的状态特别复杂,并且有很多地方都会更新状态时,每一次更新状态都传递一个回调函数就会有点过于入侵性强了。

不过这个应用相对简单,开发总共也就花了大约3个小时,至于上面提到的场景下如何写出性能良好、代码解耦的逻辑,确实值得思考。