v-once

คำสั่ง v-once ของ Vue นี้จะแสดงข้อมูลเพียงแค่ครั้งเดียวเท่านั้น

ตัวอย่าง

<div id="app">
  <div v-once>This message display once</div>
</div>

<script src="js/vue.js"></script>
<script >
var app = new Vue({
  el: "#app",
  data: {}
})
</script>

ผลลัพธ์

คำอธิบาย

คำสั่ง v-once นี้เหมือนจะไม่มีอะไรพิเศษ และ เหมือนไม่รู้มันถูกสร้างขึ้นมาทำไม แต่ทางผู้สร้างเขาบอกว่ามันจะช่วยเรื่อง performance ในการ render วิว ว่างั้น

แน่นอนว่า ในอนาคตเมื่อเราได้ศึกษาเรื่องการวางโครงสร้าง Vue ออกเป็นโมดูล คำสั่งนี้น่าจะมีประโยชน์

คุณอาจจคิดว่า ถ้าหากมัน render แค่ครั้งเดียวแล้วเปลี่ยนแปลงอะไรมันไม่ได้อีก ทำไมไม่ทำมันเป็น html โต้งๆไป ครับ เวลาโครงสร้างหน้าเว็บเราถูกแยกออกเป็นโมดูล เพื่อให้เป็นไปในทางเดียวกันทั้งหน้า เราก็ควรจะสร้างสิ่งที่เป็น static ให้เป็นโมดูลเช่นกัน เพื่อให้ภาพในจินตนาการเป็นไปในทิศทางเดียวกัน