Vueでのトグル操作におけるテキスト切り替え
トグル操作の際に、ボタンにその時点で実行される操作名を表示するようにしてみましょう。 そのためには、以下のように三項演算子を使用する必要があります。
<template>
<button @click="toggle">
{{ visible ? 'hide' : 'show' }}
</button>
</template>
3つの段落と3つのボタンがあります。 各ボタンが対応する段落をトグルし、同時にボタンのテキストを適切に変更するようにしてください。