Question

我正在尝试为我的本机项目创建一个图像滑块，但我不知道为什么它一直向我发送此错误：ReferenceError：找不到变量：道具，当我有以下构造函数和render;

constructor(props){ 
 super(props)
  this.state = {
   imagesSlider: [
    require('../images/1.jpg'),
    require('../images/2.jpg')
   ]
  }
}

render() {
 return (
  <Swiper style={styles.slide} autoplay> {
   this.state.imagesSlider.map(function(item,i){
    <View key={i}>
     <Image source={props.item}/>
    </View>
   })
  }
  </Swiper>
 );
}

Answer 1

您应该使用＆＃39; this＆＃39;来引用您的道具和状态变量。所以在你的应该改为：

<Image source={this.props.item}/>

Answer 2

你无法直接访问道具，而道具将在此背景下可用。因此，使用 this.props 从道具中获取值，而不是直接使用道具。您需要为解决方案更改以下代码： -

render() {
 return (
  <Swiper style={styles.slide} autoplay> {
   this.state.imagesSlider.map(function(item,i){
    <View key={i}>
     <Image source={this.props.item}/>  ===> this needs to be changed to get the value of item from props.
    </View>
   })
  }
  </Swiper>
 );

更新： -

根据评论，如果您使用状态变量的地图中的项目而不是从道具获取项目，那么您需要更改您的代码如下： -

render() {
 return (
  <Swiper style={styles.slide} autoplay> {
   this.state.imagesSlider.map(function(item,i){
    <View key={i}>
     <Image source={item}/>  ===> this needs to be changed to get the value of item from the map of state variable.
    </View>
   })
  }
  </Swiper>
 );

无法找到变量：props（react-native）

2 个答案: