为了账号安全,请及时绑定邮箱和手机立即绑定

数组map()接收[object Object]而不是item

数组map()接收[object Object]而不是item

元芳怎么了 2021-05-11 13:19:22
我的目的是在一行中渲染5个星星:constructor(props) {    super(props);    this.state = {        selectedStar: '',        ...    };    this.starsArray = [1, 2, 3, 4, 5] // is used like indexes}onStarPress = (index) => {    console.warn('index = ' + index); // index here is [object Object] instead of 1, 2, 3 ...    this.setState({        selectedStar: index    });}renderStars = () => (    this.starsArray.map((starIndex, i) => (        <Star            key = {i}            color = {this.defineStarColor(starIndex)}            onStarPress = {(starIndex) => {this.onStarPress(starIndex)}}        />    )))当我map()对索引数组执行starIndex等于[object Object]而不是1、2、3 ...i这里等于1,2 ...与key。但是当我将其传递给下面的函数时,它也变成[object Object]我做错了什么?
查看完整描述

2 回答

?
开满天机

TA贡献1786条经验 获得超13个赞

在这一行中onStarPress = {(starIndex) => {this.onStarPress(starIndex)}},第一个starIndex是事件处理对象。onStarPress接收对象也是如此。


有两种方法可以解决此问题:


onStarPress = (e,index) => {

    console.warn('e = ' + e); 

    console.warn('index = ' + index); 

    this.setState({

        selectedStar: index

    });

}


renderStars = () => (

    this.starsArray.map((starIndex, i) => (

        <Star

            key={i}

            color={this.defineStarColor(starIndex)}

            onStarPress={(e) => { this.onStarPress(e,starIndex) }}

        />

    ))

)

其他方式是:


onStarPress = (index) => (e) => {

    console.warn('e = ' + e); 

    console.warn('index = ' + index); 

    this.setState({

        selectedStar: index

    });

}


renderStars = () => (

    this.starsArray.map((starIndex, i) => (

        <Star

            key={i}

            color={this.defineStarColor(starIndex)}

            onStarPress={this.onStarPress(starIndex)}

        />

    ))

)


查看完整回答
反对 回复 2021-05-27
  • 2 回答
  • 0 关注
  • 209 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信