Chuyển đổi (toggle) phần tử trong Vue
Bây giờ hãy tạo một nút bấm
sẽ chuyển đổi (toggle) một đoạn văn, tức là với lần nhấp đầu tiên
sẽ hiển thị nó, còn với lần nhấp thứ hai
sẽ ẩn đi. Để làm điều này, khi nhấp vào
nút, chúng ta sẽ gọi phương thức
toggle:
<template>
<button @click="toggle">chuyển đổi</button>
<p v-if="visible">văn bản</p>
</template>
Trong mã của phương thức, chúng ta sẽ lấy
giá trị của thuộc tính visible
và đảo ngược nó thành giá trị
ngược lại:
toggle: function() {
this.visible = !this.visible;
}
Cho ba đoạn văn và ba nút bấm. Hãy làm sao để mỗi nút chuyển đổi (toggle) đoạn văn của riêng nó.
