react native render 中for循环，if 判断返回视图

最新推荐文章于 2022-05-05 16:47:30 发布

weixin_33939843

最新推荐文章于 2022-05-05 16:47:30 发布

阅读量2.7k

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/KJhulinhua/blog/1476497

版权

2019独角兽企业重金招聘Python工程师标准>>>

for循环返回视图

在很多场景中我们需要for循环返回视图
如何for循环返回视图呢？
直接来个栗子吧～

  render(){
    console.log('首页刷新');
    let renderList = [require('./img/1.jpg'),require('./img/2.jpg'),require('./img/3.jpg'),require('./img/4.jpg')];
    return(

      <View>
        <Swiper style={styles.wrapper} height={200} autoplay>
          {
            renderList.map((item,idx)=>{
              return(
                <View key={idx} style={styles.slide}>
                  <Image resizeMode='stretch' style={styles.image} source={item} />
                </View>

              )
            })
          }
        </Swiper>


      </View>

    );
  }

if 判断，返回视图

很多情况下，如果有数据就暂时某个视图，如果没数据就不展示视图，那如何在render中的return里面判断然后再返回相对于的视图呢，
不废话了，直接栗子

render(){
    console.log('首页刷新');
    let dataSoureeee;
    return(

      <ScrollView>

        {
          dataSoureeee != null?(
            <View><Text>有东西</Text></View>
          ):(
            <View><Text>无东西</Text></View>
          )
        }


      </ScrollView>

    );
  }

转载于:https://my.oschina.net/KJhulinhua/blog/1476497