Chỉ thị Vue v-once
Ví dụ
Sử dụng lệnh v-once
để chỉ hiển thị phần tử <img>
một lần.
<template>
<h1>v-once Example</h1>
<p>The image is only rendered once. Changing the image source does not have any effect.</p>
<img v-once v-bind:src="imgUrl[imgIndex]">
<p>Img src: '{{ imgUrl[imgIndex] }}'</p>
<button v-on:click="changeImg">Change image</button>
</template>
Chạy ví dụ »Định nghĩa và cách sử dụng
Lệnh v-once
được sử dụng để chỉ hiển thị một phần tử một lần.
Bằng cách chỉ hiển thị một phần tử một lần, hiệu suất có thể được nâng cao.
Khi một phần tử có lệnh v-once
, tất cả các phần tử con của nó cũng trở thành tĩnh sau lần hiển thị đầu tiên.
Tần suất một phần tử được hiển thị cũng có thể bị giới hạn bởi lệnh v-memo
để đạt được hiệu suất.
Trang liên quan
Tham khảo Vue: Chỉ thị Vue v-memo
Hướng dẫn Vue: Chỉ thị Vue v-bind
Hướng dẫn Vue: Chỉ thị Vue v-on
Hướng dẫn Vue: Phương thức Vue
Hướng dẫn về Vue: Móc vòng đời của Vue