时间戳

首页 > 解决方案 > 从现有对象数组创建新对象数组时出现引用错误？

javascript - 从现有对象数组创建新对象数组时出现引用错误？

问题描述

我有一组图像 url，我正在尝试创建一个应该如下所示的新对象： source: { uri: 'http://i.imgur.com/XP2BE7q.jpg' }

所以我使用 reduce() 来做到这一点。现在我想要修改后的 imageArray 并为其分配名为 images 的状态变量（它必须是一个数组），但我得到参考错误 imageArray not defined 为什么会这样？

我想将新创建的 imageArray 分配给状态变量，我该怎么做？目前，如果我将reduce()操作移到类组件之外，我会收到参考错误。

代码：

export default class ImageView extends Component {
  constructor(props) {
    super(props);
    this.state = {
      index: 0,
      images: imageArray
    };
  }
  render() {
    const imageArray = this.props.images.reduce((acc, images) => {
      let temp = {
        source: {
          uri: images
        }
      };

      acc.push(temp);
      return acc;
    }, []);
    console.log(imageArray);
    return <View style={{ flex: 1 }} />;
  }
}

标签： javascriptreactjs

解决方案

您imageArray在您的渲染方法内部进行定义，这超出了您的constructor. 我建议在定义图像数组后调用this.setState({ images: imageArray });，这不应该在render方法内部发生。将 state.images 初始化为空数组。在componentDidMount，减少你的this.props.images然后调用setState。

推荐阅读