时间戳

首页 > 解决方案 > TypeError：无法读取未定义的属性“imageList”

reactjs - TypeError：无法读取未定义的属性“imageList”

问题描述

我正在尝试从 state 中定义的图像数组中获取图像的随机列表。

import React, { Component } from 'react';
import card1 from '../graphics/card1.jpg';
import card2 from '../graphics/card2.jpg';
import card3 from '../graphics/card3.png';
import card4 from '../graphics/card4.jpg';
import card5 from '../graphics/card5.png';
import card6 from '../graphics/card6.png';

class BoardGame extends Component {
    state = { 
        imageList: [card1,card2,card3,card4,card5,card6],
        board: this.chooseImages(2,2)
    }

这是假设返回新数组的函数：

//choose random images at half size of board
        let data=[];
        let selectedImage;
        let imageList = this.state.imageList;
        const numOfPics=(rows*columns)/2;
        for(let i=0;i<numOfPics;i++){
           selectedImage = imageList[Math.floor(Math.random()*imageList.length)]
            data.push(selectedImage,selectedImage);
        }
        data=this.shuffleImageList(data);
        return data;
    }

'TypeError：无法读取未定义'错误点的属性'imageList'

let imageList = this.state.imageList;

我究竟做错了什么？

谢谢

标签： reactjs

解决方案

所以看起来你还没有在构造函数中初始化本地状态。如果您在组件中使用状态，则需要在构造函数中初始化状态

constructor(props) {
  super(props);
  this.state = { 
    imageList: [card1, card2, card3, card4, card5, card6],
    board: this.chooseImages(2,2)
  }
}

如果没有在构造函数中初始化状态，您就无法从组件中的状态访问它。正如 Sameer 所说，没有这个你需要使用 let 声明它

推荐阅读