在 REACT NATIVE 中基于 json 动态创建元素

Question

我是这个论坛的新手，也是 React Native 的新手。谁能给我写一段代码来创建基于 json 的表单元素（图像、拨动开关）。

我的 JSON 看起来像

[{“消费者”：“S1”，“状态”：“假”}，{“消费者”：“S2”，“状态”： “假”}，{“消费者”：“S3”，“状态”：“真”}，{“消费者”：“S4”， “状态”：“假”}，{“消费者”：“S7”，“状态”：“假”}]

我想为每种模式获取 i，例如：

<View style={{width: '30%', height: 200}}>
          <Image
            source={
              require('../assets/images/s1.png') //sx
            }
            style={styles.welcomeImage}
          />

        </View>
        <View style={{width: '30%', height: 200}}>
          <Switch
            //here get status of s1..s8
        </View>

Answer 1

您应该通过数组进行映射。像这样的：

render() {
  var consumers = [{ "consumer": "S1", "status": "False"},{ "consumer": "S2", "status": "False"},{"consumer": "S3", "status": "True"},{ "consumer": "S4", "status": "False"},{ "consumer": "S7", "status": "False"}];
  return (
    {consumers.map((c, i) => {
      return [
        <View style={{width: '30%', height: 200}}>
          <Image
            source={require('../assets/images/' + c.consumer + '.png')}
            style={styles.welcomeImage}
          />
        </View>
        <View style={{width: '30%', height: 200}}>
          <Switch value={c.status} />
        </View>
      ]
    })}
  );
}