【uni-app】在组件mounted中使用uni.getStorage,成功的回调中设置data中的数据不成功,也不报错


<script>
	export default {
		name: "newsPage",
		data() {
			return {
				formData: {
					title: '',
					author: '',
					content: '',
				},
				isEditShow: false
			};
		},
		mounted() {
			this.isEditShow = false
			uni.getStorage({
				key: 'articleInfo',
				success(res) {
					console.log(this.formData)
					console.log(res.data)
				}
			})
			console.log("Mounted", this.formData)
		},
		destroyed() {
			console.log("destroyed", this.formData)
		}
	
	}
</script>

请添加图片描述

console.log(this.formData) 显示的是 undefined
推测是 this指向的问题

修改代码

	uni.getStorage({
				key: 'articleInfo',
				success: (res) => {
					console.log(this)
					this.isEditShow = false
					this.formData = res.data

				}
			})

请添加图片描述

uni-app 使用 mpvue-echarts 遇到无法访问 data 数据的问题,可能是由于以下几个原因: 1. 数据绑定问题:确保你在 echarts 初始化的时候已经正确地将数据绑定到了图表上。例如,在 options 对象引用 `this.data`,而不是直接写静态值。```html <template> <view> <ec-charts :options="chartOptions" ref="myChart"></ec-charts> </view> </template> <script> export default { data() { return { chartOptions: { series: [{ data: this.data // 确保此处的数据来自 data 属性 }] } }; }, //... } </script> ``` 2. 数据更新延迟:ECharts 的异步更新机制可能导致数据在渲染之前未被更新。尝试在 Vue 生命周期钩子里初始化图表,并在数据改变时手动触发刷新。例如,可以添加 `mounted()` 和 `updated()` 方法。 ```javascript mounted() { this.updateChart(); }, updated() { if (this.dataChanged) { // 检查数据是否已更新 this.$refs.myChart.setOption({ ...this.chartOptions }); } }, methods: { updateChart() { this.$nextTick(() => { this.$refs.myChart.setOption(this.chartOptions); }); } }, data() { return { data: [], // 初始数据 dataChanged: false, chartOptions: {} }; } ``` 3. 检查权限和依赖:确保在使用 mpvue-echarts 时,项目已经安装了正确的库版本,并且在运行环境能正常访问 ECharts 的 API。 如果以上步骤都检查过了还是有问题,你可以尝试提供更具体的错误信息,以便更好地定位问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

起伏羊

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值