通过 react-native 中的键值迭代 JSON 数组

Question

无论如何从 json 数组中获取对象中的值。我需要从一个基于另一个值的对象中获取一个值。

我的代码如下：

export default class StandardComp extends Component {
    constructor(props) {
        super(props)
        this.state = {
           id: '',
           email: 'abc@gmail.com',
           dataSource: []
        };    
    }

    componentDidMount(){
        fetch(someURL, {
        method: 'GET',
        headers: {
            'Content-Type': 'application/json'
           }
        })
        .then((response) => response.json())
        .then((responseJson) => {
            this.setState({dataSource: responseJson})
            //dunno what to do here
        })
        .catch((error) => {
           console.error(error);
        })
    }
}

我的“responseJson”是这样的。然后提供键值（abc@gmail.com），我怎样才能得到字符串“abcdef”？

[
   {
      "id": "qwerty",
      "email": "cat@gmail.com",
      "name": "cat"
   },
   {
      "id": "abcdef",
      "email": "abc@gmail.com",
      "name": "abc"
   }         
   {
      "id": "owowao",
      "email": "dog@gmail.com",
      "name": "dog"
   },
]

提前谢谢你。

Answer 1

找到匹配email的元素并返回id。

array::find

const data = [
   {
      "id": "qwerty",
      "email": "cat@gmail.com",
      "name": "cat"
   },
   {
      "id": "abcdef",
      "email": "abc@gmail.com",
      "name": "abc"
   },       
   {
      "id": "owowao",
      "email": "dog@gmail.com",
      "name": "dog"
   },
];

const findIdByEmail = (data, email) => {
  const el = data.find(el => el.email === email); // Possibly returns `undefined`
  return el && el.id; // so check result is truthy and extract `id`
}

console.log(findIdByEmail(data, 'cat@gmail.com'));
console.log(findIdByEmail(data, 'abc@gmail.com'));
console.log(findIdByEmail(data, 'gibberish'));

Answer 2

代码将取决于您如何获得值abc@gmail.com。

您可能需要通过道具将其作为参数传递给componentDidMount？或者将其提取到单独的函数中。这取决于。

这样的事情是我想说的最基本的方式。

const value = responseJson.filter(obj => obj.email === 'abc@gmail.com')[0].id

这里是在你的类中实现的。

export default class StandardComp extends Component {
  ...

  componentDidMount(){
    fetch(someURL, {
    method: 'GET',
    headers: {
        'Content-Type': 'application/json'
       }
    })
    .then((response) => response.json())
    .then((responseJson) => {
        this.setState({ dataSource: responseJson })
        const { email } = this.state
        const value = responseJson.filter(obj => obj.email === email)[0].id

    })
    .catch((error) => {
       console.error(error);
    })
  }

}