Question

我在组件中设置属性时遇到问题，我想将类设置为createdImages()返回的数组中的第一个元素。

如何引用此数组，然后设置类？

class Slider extends Component{
  constructor(){
    super();
    this.state = {
      imagesArray : ['css', 'html', 'javascript']
    };

  };

  createdImages() {
    return this.state.imagesArray.map(image => {
      return <img key={image} src={require(`./img/${image}.png`)} />
   });
  }

  render() {
    return (
      <div id="slider">
        { this.createdImages() }
      </div>
    );
  }    
};

Answer 1

以您描述的方式设置属性意味着在React之外操作DOM。哪个可行，但可能不是最佳方法。

最简单的方法是将当前的迭代器添加到映射中。然后为第一个元素（其中index是0）添加您的课程：

createdImages() {
  return this.state.imagesArray.map((image, index) => (
    <img
      key={image}
      className={index === 0 ? 'foo-bar' : ''}
      src={require(`./img/${image}.png`)}
    />
  ));
}

将setAttribute反应为.map数组中的特定元素

1 个答案: