Flutter 持久化_shared_preferences

購物車中的一項功能是持久化，就是我們關掉APP，下次進入后，還是可以顯示出我們放入購物車的商品。

Flutter提供了三種持久化工具，數據庫sqflite、shared_preferences、文件file。

但是這些商品不和后台進行數據交互，前台如果使用sqflite又顯得太重，還要懂SQL知識。所以在購物車頁面我們采用shared_preferences來進行持久化，它是簡單的鍵-值的操作。

認識shared_preferences

shared_preferences是一個Flutter官方出的插件，它的主要作用就是可以key-value的形式來進行APP可客戶端的持久化。

GitHub地址:https://github.com/flutter/plugins/tree/master/packages/shared_preferences

項目包依賴設置

既然是插件，使用前需要在pubspec.yaml里進行依賴設置，直接在dependencies里加入下面的代碼:

shared_preferences: ^0.5.3+4

注意使用最新版本。

shared_preferences 增加方法

先來看看shared_preferences如何進行增加所存儲的key-value值。刪除購物車頁面以前的代碼，在這個頁面進行新知識的學習。

先引入幾個必要的包，使用shared_preferences前是要用import進行引入的。

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

然后用快速生成的方法stful，生成一個StatefulWidget類，起類名叫CartPage。在類里聲明一個變量testList。

List<String> testList =[];

此時代碼如下：

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';


class CartPage extends StatefulWidget {
  @override
  _CartPageState createState() => _CartPageState();
}

class _CartPageState extends State<CartPage> {

  List<String> testList =[];
  @override
  Widget build(BuildContext context) {
    return Container(

    );
  }
}

編寫增加方法

我們在類里聲明一個內部方法add,代碼如下:

void _add() async {
      SharedPreferences prefs = await SharedPreferences.getInstance(); //初始化 
      String temp="my是最棒的！！！";
      testList.add(temp);
      prefs.setStringList('testInfo', testList);
      _show();
  }

編寫顯示方法

void _show() async{
    SharedPreferences prefs = await SharedPreferences.getInstance(); //初始化 
    setState(() {
        if(prefs.getStringList('testInfo')!=null){
            testList=prefs.getStringList('testInfo');
        }
       
    });
  }

編寫刪除方法

void _clear() async{
    SharedPreferences prefs = await SharedPreferences.getInstance(); //初始化
    //prefs.clear(); //全部清空
    prefs.remove('testInfo'); //刪除key鍵
    setState((){
      testList=[];
    });
  }

增加修改用set方法，查詢用get， 刪除是clear和remove方法。

build方法編寫

有了這些方法，我們只要在build里加入一個ListView再加上兩個按鈕就可以了。

@override
  Widget build(BuildContext context) {
    _show();  //每次進入前進行顯示
    return Container(

      child:Column(
        children: <Widget>[
          Container(
            height: 500.0,
            child: ListView.builder(
                itemCount:testList.length ,
                itemBuilder: (context,index){
                  return ListTile(
                    title: Text(testList[index]),
                  );
                },
              ) ,
          ),
         
          RaisedButton(
            onPressed: (){_add();},
            child: Text('增加'),
          ),
          RaisedButton(
            onPressed: (){_clear();},
            child: Text('清空'),
          ),
        ],
      )
       
    );
  }

這樣就完成了所有代碼的編寫，通過簡單的例子學會shared_preferences的增刪改查操作。

完成代碼如下：

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

class CartPage extends StatefulWidget {
  @override
  _CartPageState createState() => _CartPageState();
}

class _CartPageState extends State<CartPage> {
  List<String> testList = [];
  @override
  Widget build(BuildContext context) {
    _show();  //每次進入前進行顯示
    return Container(
      child: Column(
        children: <Widget>[
          Container(
            height: 500.0,
            child: ListView.builder(
              itemCount: testList.length,
              itemBuilder: (context,index){
                return ListTile(
                  title: Text(testList[index]),
                );
              },
            ),
          ),

          RaisedButton(
            onPressed: (){_add();},
            child: Text('增加'),
          ),
          RaisedButton(
            onPressed: (){_clear();},
            child: Text('清空'),
          )
        ],
      ),
    );
  }

  //增加方法 
  void _add() async{
    SharedPreferences prefs=await SharedPreferences.getInstance(); //初始化
    String temp = 'my是最棒噠！！！！！';
    testList.add(temp);
    prefs.setStringList('testInfo', testList);
    _show();
  }
  //查詢顯示
  void _show() async{
     SharedPreferences prefs=await SharedPreferences.getInstance(); //初始化
     if(prefs.getStringList('testInfo')!=null){ //查詢get
       setState(() {
        testList = prefs.getStringList('testInfo');
       });
     }
  }
  //刪除
  void _clear() async{
    SharedPreferences prefs=await SharedPreferences.getInstance(); //初始化
     //prefs.clear();//全部刪除
    prefs.remove('testInfo'); //刪除指定key鍵
    setState(() {
     testList = [];
    });
   }

}

運行后的結果：

這時退出運行，頁可以在終端內輸入q就是退出了。

然后重新運行flutter run，發現剛才添加的三條數據還在，持久化成功。