将 sharedPreference 值分配给构建中的变量答案

【问题标题】：Assigning the sharedPreference value to a variable within the build将 sharedPreference 值分配给构建中的变量
【发布时间】：2022-01-01 09:56:31
【问题描述】：

我已经成功地将一个值作为字符串存储在 localStorage 中，如下所示：

var acceptedCompany = jsonEncode('${item.company!.name!}');
print('storedCompany: $acceptedCompany'); // succesfully prints value as 'abc'
await sharedPref.save('savedCompany', acceptedCompany);

现在我想从另一个屏幕读取存储的值并将其分配给一个变量，然后我可以将其绑定到我的 Text() 小部件。我已成功访问控制台中的值。但是，当我尝试将存储的值分配给变量时，出现错误：

"Instance of Future<dynamic>"

这是取回存储值的方法：

class _SideBarState extends State < SideBar > {
  SharedPref sharedPref = SharedPref();
  var savedCompany;
  String key = 'storedCompany';

  @override
  @override
  void didChangeDependencies() {
    getCompany();
    super.didChangeDependencies();
  }

  getCompany() async {
    savedCompany = await sharedPref.read(key);
    print('getComp: $savedCompany'); // this returns the stored value i.e 'abc' but I can't assign this to the Text widget
  }

  @override
  Widget build(BuildContext context) {
    var savedCompany2 = getCompany();
    print('getComp2: $savedCompany2'.toString()); // generates an error 'Instance of Future<dynamic>'
    return Text($savedCompany2);
  }
}

我的 SharedPref 类如下所示：

read(key) async {
  final prefs = await SharedPreferences.getInstance();
  final value = prefs.getString(key) ? ? 0;
  // print('retrievedValue: ' + '$value');
  return value;
}

save(key, value) async {
  final prefs = await SharedPreferences.getInstance();
  // prefs.setString(key, json.encode(value));
  prefs.setString(key, value);
  // print('savedToken:' + '$key');
}

如何访问sharedPreference 值并将其分配给我可以绑定到文本小部件的变量？

【问题讨论】：

标签： flutter dart flutter-web

【解决方案1】：

要解决此问题，您可以在initState 之后设置值或使用FutureBuilder。

FutureBuilder:

class SideBar extends StatefulWidget {
  const SideBar({Key? key}) : super(key: key);

  @override
  State<SideBar> createState() => _SideBarState();
}

class _SideBarState extends State<SideBar> {

  SharedPref sharedPref = SharedPref();
  String key = 'storedCompany';

  Future<String> getCompany() async {
    return await sharedPref.read(key);
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<String>(
      future: getCompany(),
      builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
        if (snapshot.hasData) {
          return Text('Result: ${snapshot.data}');
        } else if (snapshot.hasError) {
          return Text('Error: ${snapshot.error}');
        } else {
          return Center(child: CircularProgressIndicator());
        }
      },
    );
  }
}

initState()之后：

class SideBar extends StatefulWidget {
  const SideBar({Key? key}) : super(key: key);

  @override
  State<SideBar> createState() => _SideBarState();
}

class _SideBarState extends State<SideBar> {

  SharedPref sharedPref = SharedPref();
  String key = 'storedCompany';

  String? _companyName;

  Future<void> getCompany() async {
    var name = await sharedPref.read(key);
     
    setState(() {
      _companyName = name;
    });
  }

  @override
  void initState() {
    super.initState();
    getCompany();
  }

  @override
  Widget build(BuildContext context) {
    if(_companyName == null) return Center(child:CircularProgressIndicator());
    return Text(_companyName!);
  }
}

【讨论】：