在反应中使用道具映射
问题描述:
我已经从我的API中获取了组,并且我可以看到它们通过了UI和道具,但不知何故显示组的名称并未发生。在反应中使用道具映射
这是我如何映射它:
<List>
{this.props.groups && this.props.groups.map((g) =>
<ListItem key={g.Id} primaryText={g.Name} onClick={this.handleClickItem(g)} />) }
{(!this.props.groups || this.props.groups.length === 0) && "No groups found."}
</List>
redux devtools showing the data showing the props hold the data
答
我看到了 '名' 属性的小写: 它应该 'g.name' 而不是 'g.Name'
答
查看您的道具的输出,组对象中的键是小写字母。 g.name
不是g.Name
,您收到的错误是由于区分大小写。另外onClick需要你传递一个函数,没有箭头函数,当React渲染组件时,handleClickItem函数将被调用。
你的列表项成分应该是:
<ListItem
key={g.id}
primaryText={g.name}
onClick={() => this.handleClickItem(g) }
/>
答
我相信你映射一个数组的数组,这就是为什么你不能访问关键的要素。
答
这是一个大小写敏感的问题,因为我导入了类型而不是模型,所以g.name现在可用并且正在工作。
我试过,其实没有任何运气。 当我console.log整个对象'g'然后它通过好,但当我尝试console.log(g.Name)它说undefined:/ – djohan
他说'g'没有一个属性'名称“,这就是为什么你没有定义。它是小写字母。尝试记录'g.name' –