Паказ па ўмове ў Vue

Наступная дырэктыва, якую мы вывучым, называецца v-if. З яе дапамогай можна паказваць ці хаваць элементы. Як гэтая дырэктыва працуе: параметрам яна прымае любы ўласцівасць аб'екта data. Калі гэтая ўласцівасць мае значэнне true - то элемент будзе паказаны, а калі false - то схаваны.

Давайце паглядзім на прыкладзе. Хай у нас ёсць абзац з атрыбутам v-if. Значэннем гэтага атрыбута хай служыць уласцівасць visible, вось так:

<template>
	<p v-if="visible">text</p>
</template>

Давайце ўсталюем значэнне нашай уласцівасці у true. У гэтым выпадку абзац будзе паказаны:

data() {
	return {
		visible: true,
	}
}

А вось калі visible паставіць у значэнне false, то абзац будзе схаваны:

data() {
	return {
		visible: false,
	}
}

Хай у data захоўваецца ўласцівасць visible. Хай у вас таксама ёсць два абзацы. Зрабіце так, каб першы абзац быў паказаны на экране, калі ўласцівасць visible роўна true, а другі абзац, наадварот, паказаны, калі ўласцівасць visible роўна false.