根據狀態設置圖標onPress

Question

我試圖設置onPress來調用action來分派圖標，具體取決於Redux中的狀態。

<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

你需要保持表達的大括號內{}這樣

<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

你可以只寫一個3功能，如果語句中使用。

<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>