Judging conditions, rendering different components under different conditions:
when ele.PlantingCrop is a different value, the components rendered here are also different. The specific ES6 syntax sugar is shown in the code:
{condition && (component)}
{
ele.PlantingCrop === '种植中' && (
<Tag color="rgba(55, 58, 58, 1)">
<p style={
{
color: 'rgba(63, 217, 163, 1)' }}>种植中</p>
</Tag>
)}
{
ele.PlantingCrop === '已收获' && (
<Tag color="rgba(55, 58, 58, 1)">
<p style={
{
color: 'white' }}>已收获</p>
</Tag>
)}
When props.editorInfo is "true" value, ES6 syntactic sugar can be:
{Condition? (Component 1): (Component 2)}
For example, to judge the value of props:
{
props.editorInfo ? (
<Tag color="rgba(55, 58, 58, 1)">
<p style={
{
color: 'rgba(63, 217, 163, 1)' }}>种植中</p>
</Tag>
):(
<Tag color="rgba(55, 58, 58, 1)">
<p style={
{
color: 'white' }}>已收获</p>
</Tag>
)}