vue里如何主动销毁keep-alive缓存的组件
时间: 2023-05-02 21:04:12 浏览: 82
在Vue中,可以通过在配置文件的vue.config.js中添加以下代码来启用keep-alive组件的缓存:
```
module.exports = {
chainWebpack: config => {
config.plugin('html').tap(args => {
args[0].minify.keepClosingSlash = true
return args
})
},
configureWebpack: {
optimization: {
splitChunks: {
minSize: 30000,
maxSize: 100000,
cacheGroups: {
default: {
minChunks: 2,
priority: -20,
reuseExistingChunk: true,
},
vendors: {
test: /[\\/]node_modules[\\/]/,
priority: -10,
},
component: {
name: 'keep-alive-component',
test: /[\\/]node_modules[\\/]/,
chunks: 'all',
enforce: true,
},
},
},
},
},
};
```
其中,最重要的是添加了一个名为“keep-alive-component”的组件,使Vue在构建时会自动将keep-alive组件进行缓存处理。