상태에 따라 아이콘을 설정하십시오.

Question

Redux의 상태에 따라 아이콘 디스패치를 ​​위해 action을 호출하도록 onPress를 설정하려고합니다.

<MaterialIcons 
     name="arrow-upward" size={30} style={mystyles1.myIcon} 
     onPress = this.props.style.name === 'styleNormal' ? 
      {() => this.props.changeStyleNew('styleNew')} : 
      {()=>this.props.changeStyleNormal('styleNormal')} 
    > 
    </MaterialIcons> 

그래서 this.props.style.name === 'styleNormal' 경우 제 기능 ( changeStyleNew)을 통과해야하지 않을 경우 상기 제 ( changeStyleNormal). 나는 이것을 성취 할 수 없다. 오류가 발생합니다 :

TransformError C:/.../ExtComp02.js: 
JSX value should be either an expression or a quoted JSX text (94:19) 

어떻게해야합니까? 많은 감사합니다.

Answer 1

당신은 당신은 단지 3 함수를 작성할 수있는이

<MaterialIcons 
     name="arrow-upward" size={30} style={mystyles1.myIcon} 
     onPress = { 
      this.props.style.name === 'styleNormal' ? 
     () => this.props.changeStyleNew('styleNew') : 
     ()=>this.props.changeStyleNormal('styleNormal') 
     } 
    > 
</MaterialIcons> 

Answer 2

처럼 중괄호 {} 내부의 표현을 유지하고 문 경우를 사용해야합니다.

<MaterialIcons 
    name="arrow-upward" size={30} style={mystyles1.myIcon} 
    onPress={() => { 
    if (this.props.style.name === 'styleNormal') this.props.changeStyleNew('styleNew'); 
    else this.props.changeStyleNormal('styleNormal'); 
    }} 
> 
</MaterialIcons>