Question

我在AsyncStorage中存储了一个json对象，现在我想检索它的值。

在实际代码中，打印的值为[object Object]。

我希望打印嵌套在对象中的json值。

任何提示？

import React, { Component } from 'react';

import {
  Text,
} from 'react-native';

    class Inside extends Component {

        render() {
          async function getItem(item) {
            try {
              const value = await AsyncStorage.getItem(item).then((val) => {
                return JSON.parse(val);
              });
              return value;
            } catch (err) {
              if(err) {
                throw err;
              }
            }
          }
          return (
            <Text>{getItem('userdata').toString()}</Text>
          );
        }
      }

    export default Inside;

Answer 1

如果您使用字符串化{email：＆＃39; test@test.com'}并使用AsyncStorage存储它，那么您可以解析电子邮件的值：

let value = await getItem('userdata');
return (
        <Text>{JSON.parse(value).email}</Text>
       );

Answer 2

你班上有一些问题。

理想情况下，您不希望渲染中的函数或直接函数调用（尤其是异步函数）。

执行此操作的正确方法是在render之外创建异步函数，在constructor或componentDidMount生命周期内调用函数，发送结果以使用setState更新组件状态，以及在渲染中引用该状态。

这或多或少...... React 方式：

class Inside extends Component {
  constructor() {
    super()
    this.state = {
      itemString: "",
    }

    this.item = this.getItem('userdata')
  }

  async getItem(item) {
    try {
      const value = await AsyncStorage.getItem(item).then(val => {
        this.setState({ itemString: val })
        return JSON.parse(val)
      });
      return value
    } catch (err) {
      throw err
    }
  }

  render() {
    return (
      <Text>{this.state.itemString}</Text>
    );
  }
}

export default Inside

存储在asyncstorage react-native中的json对象的返回值

2 个答案: