1. 在vue文件中的script标签里定义变量导致的内存泄露

    如下,在vue文件定义了一个const变量,最终无法释放:

    // Text.vue
    <template></template>
    <script>
        const TYPE = {
            TYPE_TEST: 'type-test'
        };
        export default {
            name: "Test",
            created() {
                // 在vue里面使用TYPE
                console.log(TYPE.TYPE_TEST);
            }
        };
    </script>
    
    

    正确使用应该是从js文件中import进来:

    // test.js文件
    const TYPE = {
        TYPE_TEST: 'type-test'
    };
    export {TYPE};
    
    // Text.vue文件
    <template></template>
    <script>
        import {TYPE} from './test.js';
    
        export default {
            name: "Test",
            created() {
                // 在vue里面使用TYPE
                console.log(TYPE.TYPE_TEST);
            }
        };
    </script>
    
    
  1. 使用第三方js插件,在组件销毁的时候(beforeDestroy、destroyed)没有调用插件的销毁方法,会造成组件无法释放,内存无法回收。所以在组件销毁的时候(beforeDestroy、destroyed)一定要销毁该插件(调用该组件的销毁方法)。

  2. 禁止在vue工程里写业务逻辑代码的时候往window全局对象上注册属性。当挂载window上的内容与组件有关时候,会导致组件无法回收。

Logo

前往低代码交流专区

更多推荐