How can I render multiple conditions in ternary operator in React native?-CodePudding

Among the things that satisfy the condition of item.diaryClass.name === "pack" in reactnative If item.diaryId === 778, I want to render chicken, if 776 renders buger, and if 775 renders pizza. However, when I run my code, only the chiken value is displayed and 776 and 775 are nulled. How do I fix my code?

this is my code

return (

{item.diaryClass.name === "pack" && item.diaryId === 778 ?  
(<Text>
    chicken
</Text>)
:
(null)

}


{item.diaryClass.name === "pack" && item.diaryId === 776 ?  
(<Text>
    buger
</Text>)
:
(null)
}


{item.diaryClass.name === "pack" && item.diaryId === 775 ?  
(<Text>
    pizza
</Text>)
:
(null)

}

)

CodePudding user response：

try this,


    return (
    <View>
    {item.diaryClass.name === "pack" && item.diaryId === 778 ?  
    (<Text>
        chicken
    </Text>)
    :
    (null)
    
    }
    
    
    {item.diaryClass.name === "pack" && item.diaryId === 776 ?  
    (<Text>
        buger
    </Text>)
    :
    (null)
    }
    
    
    {item.diaryClass.name === "pack" && item.diaryId === 775 ?  
    (<Text>
        pizza
    </Text>)
    :
    (null)
    
    }
    </View>
    )

CodePudding user response：

Use this code:

return (

{item.diaryClass.name === "pack" && item.diaryId === 778 ?  
(<Text>
    chicken
</Text>)
:
item.diaryClass.name === "pack" && item.diaryId === 776 ?  
(<Text>
    buger
</Text>)
:
item.diaryClass.name === "pack" && item.diaryId === 775 ?  
(<Text>
    pizza
</Text>)
:
(null)
}