Open
Description
Version
3.6.2
Describe the bug
将vuex存储的数据使用计算属性引入,使用一个局部变量引用该计算属性,页面销毁前清除vuex的数据,该数据所占用的内容无法被释放
Reproduction
//test.vue
<template>
<div>
<div style="display: flex; justify-content: space-between;">
<button type="button"
@click="test">test</button>
<button type="button"
@click="myLogout">退出</button>
</div>
</div>
</template>
<script>
import { mapActions, mapGetters } from 'vuex'
export default {
name: 'Test',
data () {
return {
}
},
methods: {
myLogout () {
this.$router.push('/login')
},
test () {
const p = { ...this.accountInfo[0] }
},
...mapActions([
'initAccountInfo',
'clearState'
])
},
mounted () {
let AccountArr = []
for (let i = 0; i < 10000; i++) {
AccountArr.push({ value: i.toString(), label: i.toString() })
}
this.initAccountInfo(AccountArr)
},
computed: {
...mapGetters([
'accountInfo'
]),
},
beforeDestroy () {
this.clearState()
}
}
</script>
//login.vue
<template>
<div>
<div style="display: flex; justify-content: space-between;">
<button type="button"
@click="test">test</button>
<button type="button"
@click="myLogout">退出</button>
</div>
</div>
</template>
<script>
import { mapActions, mapGetters } from 'vuex'
export default {
name: 'Test',
data () {
return {
}
},
methods: {
myLogout () {
this.$router.push('/login')
},
test () {
const p = { ...this.accountInfo[0] }
},
...mapActions([
'initAccountInfo',
'clearState'
])
},
mounted () {
let AccountArr = []
for (let i = 0; i < 10000; i++) {
AccountArr.push({ value: i.toString(), label: i.toString() })
}
this.initAccountInfo(AccountArr)
},
computed: {
...mapGetters([
'accountInfo'
]),
},
beforeDestroy () {
this.clearState()
}
}
</script>
//index.js
import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
export default new Vuex.Store({
state:{
accountInfo:[],
},
getters:{
accountInfo: (state) => state.accountInfo
},
mutations:{
initAccountInfo (state, arr){
state.accountInfo = arr
},
clearState(state){
state.accountInfo = []
}
},
actions:{
initAccountInfo({commit},payload) {
commit('initAccountInfo',payload)
},
clearState({commit}) {
commit('clearState')
}
}
});
先登录,点击test,然后退出,使用谷歌的memory查看snapshot,array的第一个就是这个未被释放的引用
Expected behavior
期望内存被释放
Additional context
No response
Validations
- Follow our Code of Conduct
- Read the docs.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Metadata
Metadata
Assignees
Labels
No labels