I am trying to use conditional statement in Text in TouchableObecity in ReactNative-CodePudding

I am trying to use conditional statement in Text in TouchableObecity in ReactNative but nothing is shown in the screen. the file is .tsx

Here is my code `

let count=1
<TouchableOpacity
                                    onPress={() => {}}
                                >

                                    <Text style={{
                                        // paddingLeft: 8,
                                        width:'100%',
              
                                    }}>
                                        {()=> {
                                            if (count==1) {
                                                <Text>
                                                View Order
                                            </Text>
                                            } else if (count==2) {
                                                <Text>
                                                    View Product
                                                </Text>
                                            }
                                        }} 
                                    </Text>
                                </TouchableOpacity>

CodePudding user response：

Try using simple form like this:

let count=1
<TouchableOpacity
    onPress={() => {}}>
    <Text style={{
          // paddingLeft: 8,
          width:'100%',
      }}>

      {count === 1 ? <Text>View Order</Text> : count === 2? <Text> View 
Product </Text> : <Text>Third command</Text>}
                                         
    </Text>
</TouchableOpacity>

To add more conditions: use condition after ":"

CodePudding user response：

const render_txt = () => {
  let count = 1;
  switch(count) {
  case 1:
    return 'every thing you want 1';
  case 2:
    return 'every thing you want 2';
  default:
    // code block
    break;
  }
}

<TouchableOpacity onPress={() => {}}>
  <Text style={{ paddingLeft:8, width:'100%'}}>
    {render_txt()} 
  </Text>
</TouchableOpacity>

CodePudding user response：

For best performance

let count = 1;

<TouchableOpacity>
    <Text style={{width:'100%'}}>
      {count === 1 ? "View Order" : count === 2? "View Product" : "Third command"}                                  
    </Text>
</TouchableOpacity>