v-once
v-once 也是一个不需要表达式的指令,作用是定义它的元素或组件只渲染一次,包括元素或 组件的所有子节点。
首次渲染后,不再随数据的变化重新渲染,将被视为静态内容。
v-once
指令可以用于任何元素或组件,并在绑定数据后,将其内容标记为一次性的,不再响应数据的更新。
用法如下:<span v-once>{{ data }}</span>
示例如下所示:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>v-text|v-html</title> <script type="text/javascript" src="../Js/vue.js"></script> </head> <body> <div id="app"> <p v-once>v-once初始化:{{msg}}</p> <!-- msg不会改变 --> <p>插值语法:{{msg}}</p> <input type="text" v-model="msg" name="" /> </div> <script type="text/javascript"> let vm = new Vue({ el: "#app", data: { msg: "Hello v-once", }, }); </script> </body> </html>
博客内容主要用于日常学习记录,内容比较随意,如有问题,还需谅解!!!