vue 内置指令-v-pre/v-memo

一、v-pre 使用了该指令的元素和子元素会被编译忽略，也就是不进行编译，其中包含的所有vue模版语法都会原样显示，作用加快vue的编译

例子：

    

      {{不会被编译}}
      
    

运行效果：

二、v-memo vue3.2+新增命令

       提高渲染能力，接收的一个数组，上次数组值和本次获取的数组值不变情况下，直接复用缓存中的进行渲染，如果数组不相同，则会重新渲染

例子：

v-memo 提高性能，接收的一个数组
        
        

     {{item.id}}  
     {{item.name}}  
     状态{{item.status}}  
     更新状态

运行效果：点击更新状态，渲染状态为false 的耗时为平均为18.51416015625 ms

未加v-memo="[item.status]" 耗时如下:55.84326171875 ms

总结：加了v-memo ，在大数据时，可以有效减少前段渲染耗时

完整例子：

    
    
    


     
    

        {{msg}}
        
v-pre
        

            {{不会被编译}}
            
        
        
v-memo 提高性能，接收的一个数组
        
        
        

           {{item.id}}  
           {{item.name}}  
           状态{{item.status}}  
           更新状态