Question

首先抱歉，因为我的英语水平很低。

我正在研究本地人的反应。尝试更改具有状态的图像，但不起作用。错误：null不是对象（this.state.admob）

index.js


   class HomeScreen extends React.Component {    
   constructor(props){
       super(props);
       this.state = {admob: require('../Img/admob1.jpg'), admobCount: 0};
   }

   _changeAdmob(){
       this.setState({
           if(admobCount = 0){
               admobCount: this.state.admobCount + 1;
               admob: require('../Img/admob1.jpg');
           },
           if(admobCount = 1){
               admobCount: 0;
               admob: require('../Img/admob2.png');
           }
       });
   }

   componentDidMount(){
       this.admobTimer = setInterval(
           () => this._changeAdmob(), 2000
       );
   }

   componentWillUnmount(){
       clearInterval(this.admobTimer);
   }

   render() {                          
     return (          
         <View style={styles.MasterContainer}>
             <NavBar navigation = {this.props.navigation}/>
             <UserBar navigation = {this.props.navigation}/>
             <View style={{height: 40,}}></View>
             <ButtonTab/>
             <Admob/>
             <TapBar/>
         </View>
     );
   }
  }

   class Admob extends React.Component{
     render() {
         return(
             <View style={{ flex: 1,alignItems: 'center',justifyContent:'center' }}>
                 <Image style={{ width: 350, height: 70 }} source={this.state.admob}></Image>                 
             </View>
         );
     }
  }

**我想每2秒更改一次图像。**

Answer 1

您需要在组件<Admob admob={this.state.admob} />上传递状态

将其添加到index.js

<View style={styles.MasterContainer}>
          <NavBar navigation = {this.props.navigation}/>
          <UserBar navigation = {this.props.navigation}/>
          <View style={{height: 40,}}></View>
          <ButtonTab/>
          <Admob admob={this.state.admob}/>
          <TapBar/>
</View>

Admob.js将this.state更改为this.props

<Image style={{ width: 350, height: 70 }} source={this.props.admob}></Image>

以错误状态反应本机更改的img

1 个答案: