问题描述： 代码里使用computed获取mapGetters的数据后，直接在页面使用，在methods中更新数据后，控制台打印数据已经更改，但是页面上的数据没有同步更改和响应。

分析：

1.computed是计算属性，所有相关于计算的方法可以放在里面，并且computed在页面初始加载的时候会调用一次，存在缓存，再次更新需要computed里面依赖的属性发生变化才会再次执行
2.methods是方法，方法是只要调用此方法，就会执行当前函数，无论数据是否发生改变

到这里就很清楚原因了，当你更改当前computed获取的值的时候，并没有更改它所依赖的属性，所以不会被重新执行，相当于compued里面获取的值还是原始值，页面并不会响应。

**解决方案：**将computed获取的值重新赋值给data()里面的值，因为data的值是实时响应的。

代码实现：

export default {data() {return {defaultOpeneds: [],subMenuList: [],baseMenu: {},menuList:[],}},computed: {...mapGetters(['permission_routes','sidebar','userInfo']),...mapState({slideClass: state => state.settings.slideClass,messageCountShow: state => state.user.messageCount}),userMenuList(){let list =  this.$store.getters.menuListlist.forEach(element => {if (element) {element.open = true;} });return list},classObj() {return {[this.slideClass]: true,'has-logo': this.showLogo}},activeMenu() {const route = this.$routeconst { meta, path } = routereturn path},showLogo() {return this.$store.state.settings.sidebarLogo},},created() {},mounted() {this.setDefaultOpeneds()},setDefaultOpeneds() {this.menuList = JSON.parse(JSON.stringify(this.userMenuList));const currPath = this.$route.pathconsole.log("this.menuList",this.menuList);},
}