ListView列表项点击异常：ID为0的项点击后TextView不显示

看起来你遇到的问题很典型——日志能正常输出说明逻辑分支确实走到了，但UI没渲染，十有八九是JavaScript里0的假值特性在搞鬼！

我先帮你梳理最可能的原因：

• 你在renderDescription里控制TextView显示的条件，大概率是直接用了item.id作为判断依据（比如if (item.id)）。在JS里，0会被判定为false，而1是true，所以ID为0时条件不成立，TextView就没被渲染，但日志因为是直接打印内容，不受假值判断影响，所以能正常输出。

具体排查&修复步骤： #

1. 检查条件渲染逻辑
   找到你控制TextView显示的代码，比如如果原来的代码是这样：

   renderDescription = (item) => {
     if (item.id) { // 这里的问题！0会被当成false
       console.log(item.id === 0 ? "First text" : "Second text");
       return <TextView text={item.id === 0 ? "First text" : "Second text"} />;
     }
   }
   

   把判断条件改成明确的存在性判断或者值判断：

   // 方案1：明确判断ID是数字类型（不管是0还是其他）
   if (typeof item.id === 'number') {
     // ...你的渲染逻辑
   }
   
   // 方案2：针对你的场景直接判断目标ID
   if (item.id === 0 || item.id === 1) {
     // ...你的渲染逻辑
   }
   
   // 方案3：判断ID不是undefined/null（如果ID可能不存在的话）
   if (item.id !== undefined && item.id !== null) {
     // ...你的渲染逻辑
   }
   

2. 检查状态更新的判断逻辑
   如果你是通过点击后更新状态来控制TextView显示，比如：

   // 点击时设置状态
   onPressItem = (item) => {
     this.setState({ activeId: item.id });
   }
   
   // 渲染时判断
   renderDescription = (item) => {
     if (this.state.activeId) { // 这里0会被当成false！
       return <TextView text={...} />;
     }
   }
   

   要把判断改成严格相等：

   if (this.state.activeId === item.id) {
     return <TextView text={...} />;
   }
   

3. 确认列表项的key属性
   虽然日志能输出，但还是要确保ListView的列表项用了唯一的key（比如你的item.id），避免React的diff算法出错导致渲染异常：

   <ListView
     dataSource={this.state.dataSource}
     renderRow={(item) => (
       <MyListItem
         key={item.id} // 这里用item.id而不是index
         item={item}
         onPress={this.onPressItem}
       />
     )}
   />
   

按照上面的步骤排查，应该就能解决ID为0时TextView不显示的问题啦！

内容的提问来源于stack exchange，提问作者Morton