property “nickName“ was assigned to but it has no setter.

最新推荐文章于 2024-04-28 15:59:17 发布

翛翾梓

最新推荐文章于 2024-04-28 15:59:17 发布

阅读量411

点赞数

分类专栏： vue 前端小程序文章标签： vue.js css javascript html

本文链接：https://blog.csdn.net/weixin_43118088/article/details/117378632

版权

前端同时被 3 个专栏收录

31 篇文章 1 订阅

订阅专栏

小程序

21 篇文章 0 订阅

订阅专栏

vue

11 篇文章 0 订阅

订阅专栏

在Vue.js应用中，开发者遇到了在Vuex中存储登录信息并在计算属性中获取的问题。计算属性使用`mapState`映射了Vuex状态，但触发了Vue警告，提示没有设置setter。解决方法是为每个计算属性定义getter和setter，即使setter为空。通过这种方式，避免直接修改计算属性导致的语法错误，实现了数据的正确显示。

摘要由CSDN通过智能技术生成

在做uniapp的時候,为了方便保存登陆信息，我把数据存在vuex和stanger里面

在其他页面获取的时候我用的计算属性，watch里面我没拿到，一开始的映入方式是这样的

import {  mapState  } from 'vuex';

	computed: {
		...mapState(['userId','nickName','avatarUrl'])
	},

 [Vue warn]: 
Computed property "nickName" was assigned to but it has no setter. 
[Vue warn]: Computed property "avatarUrl" was assigned to but it has no setter.

数据展示出来了，就是包错了，
意思就是在计算属性中引用的数据，自己改变了，但是没有setter属性，
因为计算属性要改变数据需要用在setter中改变，属于语法错误，

解决方案，

	computed: {
		// ...mapState(['userId','nickName','avatarUrl'])
		userId: {
			get(){	return this.$store.state.userId;	},
			set() {	}
		}, 
		nickName: {
			get(){	return this.$store.state.nickName;	},
			set() {	}
		}, 
		avatarUrl: {
			get(){	return this.$store.state.avatarUrl;	},
			set() {	}
		}
	},