How to add strike through on Text in react native?

AndroidCssReactjsReact Native

Android Problem Overview

Hey I want to add Strike Through in $10 amount for showing cut amount. Please check below :

<View style={styles.row}>
    <View style={styles.inputWrapstotal}>
        <Text style={styles.labelcolor}>16.7% Off</Text>
    </View>
    <View style={styles.inputWrapstotal}>
        <Text style={styles.labelamount}>Rs $10</Text>
        <Text style={styles.labelamountchange}> 12 </Text>
    </View>
</View>

Please add css so that i can align in a line of both text , Thanks in Advance.

Please check the images enter image description here

Android Solutions

Solution 1 - Android

With :

<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'solid'}}>
  Solid line-through
</Text>

Solution 2 - Android

<Text style={{ textDecorationLine: 'line-through' }}>Strike through text</Text>

You can find more text styling options from the official documentation here

Solution 3 - Android

You can use textDecorationLine with 'line-through' property like below:

<Text style={{ textDecorationLine: 'line-through' }}>$12</Text>

it will put a line over your text!

Solution 4 - Android

So you want to achieve this right??

enter image description here

<Text style={styles.oldPrice}>$19.19</Text>

just pass this style to the text component

const styles = StyleSheet.create({
  oldPrice: {
    textDecorationLine: 'line-through',
    textDecorationStyle: 'solid',
  },
});
Categories
Recommended Android Solutions
Recommended Css Solutions
Recommended Reactjs Solutions
Recommended React Native Solutions

Previous Solution:

In which situation val/var is necessary in Kotlin constructor parameter?

AndroidKotlin

Next Solution:

async function - await not waiting for promise

Javascriptnode.jsAsynchronousEcmascript 2017

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionMadhurView Question on Stackoverflow
Solution 1 - AndroidAndrewView Answer on Stackoverflow
Solution 2 - AndroidalexdriedgerView Answer on Stackoverflow
Solution 3 - Androiduser8385437View Answer on Stackoverflow
Solution 4 - AndroidHarvinder SinghView Answer on Stackoverflow