百度智能小程序不能在jsx中使用条件表达式渲染组件



  • 问题描述

    通过map遍历数组,根据对应的template的值,分别显示对应的组件,h5中可以正常显示,小程序端不能渲染,而且也没报错

    复现步骤

    topicBlocks: [
      {
        "id":10045,
        "title":"重磅推荐",
        "template":1
      },
      {
        "id":10046,
        "title":"精品图书",
        "template":3
      },
      {
        "id":10047,
        "title":"热血玄幻",
        "template":4
      }
    ]
    

    期望行为

    根据 template的值,来显示对应的布局

    报错信息

    this.state.topicBlocks.map((item) => {
    const temp = item.template == 1
    return temp && 啊哈哈
    })
    

    h5: 可以正常显示

    百度小程序:不能渲染,而且也没报错

    系统信息

    Taro CLI 1.2.13 environment info:
    System:
    OS: Windows 7
    Binaries:
    Node: 10.15.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.13.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD

    解决方法:

    当你这样写的时候实际上拿一个数组去渲染文本节点,百度小程序应该不支持直接这样渲染,我建议你需要这么写的时候用一个 Text 组件包起来

    this.state.topicBlocks.map((item) => {
    const temp = item.template == 1
    return temp && <Text>啊哈哈</Text>
    })
    

登录后回复