Перечисление TextDecorationLine

Перечисление TextDecorationLine описывает строки для ключа textDecorationLine у компонента Text. Линия рисуется вдоль текста внутри одной строки или абзаца.

Синтаксис

textDecorationLine: 'underline'

Значения

Значение	Описание
`'none'`	Без декоративной линии.
`'underline'`	Линия под текстом.
`'line-through'`	Линия через середину текста.
`'underline line-through'`	Одновременно подчёркивание и зачёркивание.

Пример

Давайте подчеркнуть ссылку:

import { View, Text, StyleSheet } from 'react-native';

export default function App() {
	return (
		<View>
			<Text style={styles.link}>abcde</Text>
		</View>
	);
}

const styles = StyleSheet.create({
	link: {
		textDecorationLine: 'underline',
		color: '#112233',
	},
});

На экране 'abcde' с линией под строкой.

Пример

Давайте зачеркнуть старую цену:

import { View, Text, StyleSheet } from 'react-native';

export default function App() {
	return (
		<View>
			<Text style={styles.old}>12345</Text>
		</View>
	);
}

const styles = StyleSheet.create({
	old: {
		textDecorationLine: 'line-through',
	},
});

На экране '12345' с линией через текст.

Смотрите также

компонент Text,
который рисует декорированный текст
перечисление FontStyle,
которое задаёт наклон шрифта
перечисление TextTransform,
которое меняет регистр букв
перечисление FontWeight,
которое задаёт толщину шрифта