如何在reactnative中编写if语句，在react钩子中编写if语句？

Question

我有两个问题。

①当useState初始值真假时，if语句如何适应下面？

const [ goodbotton, setGoodBotton ] = useState(<Image source={require('../../images/good_botton_inactive.png')} style={ {width: 65, height: 65} }/>);

比如说。。

const [ goodbotton, setGoodBotton ] = useState(<Image movie?.is_my_good ? source={require('../../images/good_botton_inactive.png')} style={ {width: 65, height: 65} } : source={require('../../images/not_good_botton_inactive.png')} style={ {width: 65, height: 65} } />);

②当if语句为true和false时，如何使setGoodBotton从React钩子和if语句适应下面？

<TouchableOpacity
      onPress={() => {
        if (movie.is_my_good) {
          postGood(movie.id, false)
        } else {
          postGood(movie.id, true)
        }}>
      <View style={[commonStyles.shadow]} >　{/*here!!!!*/}
      </View>
</TouchableOpacity>

例如…（这不是工作）

if (movie.is_my_good) {
   setGoodBotton(<View style={[commonStyles.shadow]} >)
} else {
   setGoodBotton(<View style={[uncommonStyles.shadow]} >)
}

Answer 1

您试图有条件地渲染不同的图像，因此您的状态仅为您的图像。

const initialImage = movie?.is_my_good ? 'good_botton_inactive.png' : 'not_good_botton_inactive.png';
const [image, setImage] = useState(initialImage);

然后，您可以使用您的组件，如下所示

<Image source={require(`../../images/${image}`)} style={{ width:65, height:65 }} />

您可以将条件用作函数参数。

<TouchableOpacity onPress={() => postGood(movie.id, !movie.is_my_good)}>
  <View style={[commonStyles.shadow]} />
</TouchableOpacity>

来回答你问题的最后一部分

const style = movie.is_my_good ? [commonStyles.shadow] : [uncommonstyles.shadow];
setGoodBotton(<View style={style} >)