记录 uni-app 中对 data 的修改视图未更新的坑

之前只是了解过并没有实际的编写DEMO，如今公司想要采用多端统一编译框架，就想试试这个 uni-app，没想到刚开始就踩了个坑。
我在首页写了个定时器，1s 后修改内容 Hello 为 Change，根据小程序的习惯性写法，我在 uni-app 中是这样写的：

export default {data () {return {title: "Hello"}},onLoad () {let temporarySetTimeout = setTimeout(() => {this.setData({ title: "Change"}) // 使用的 uni-app 官方编辑器 HBuilderX，发现没有提示就可以知道不是这样子写// 但本人平时写代码并不在乎IDE/编辑器的代码提示，所以忘了这一点}, 1000)}
}

百度搜索这个问题后，发现很多帖子都在问修改了 data 的数据视图不更新的问题，底下有推荐使用 $set的，然后我又试了一下：

this.$set(this.$options.data, 'title', 'change')
console.log(this.$options.data.title) // 这里输出 change

字段的值已经改变了，但是视图依旧（此时我看到自己额头头发又掉了一根）。
我试图再次在百度找到答案，在这过程中我忽然想起 uni-app 是基于 vue.js 的，要不试试 Vue 对内容的更改？

this.title = 'change'
// 在定时器里直接更改 data 数值

这下就正常了，不过开发过程中联想到的可行方案还是不够平滑

记录 uni-app 中对 data 的修改视图未更新的坑相关推荐

uni app中使用图表
关于在uni app中运用图表今天写项目,需要在uni app中使用图表,我使用的是ucharts. 具体操作如下 1.下载 ucharts可以直接在uni app的插件市场下载安装. 先在插件市场 ...
uni-app - 改变数据后视图无更新变化解决方案，更改数据不刷新（解决修改 data 中的数据视图未更新的问题）
前言当页面数据全部请求完毕,但用户操作导致数据改变时,视图并未按照最新数据进行更新. 有时候,我们动态改变数据的时候发现视图并未改变, 常见于在 methods 函数或其他位置中,改变 data 数 ...
vue 修改对象的值视图没有发生改变_在vue中处理对象属性改变视图不更新问题？ - echart...
...图等等,但是这些代码比较难写,因此我们通常会用借助echarts,那你知道如何使用echarts吗?这篇文章就和大家讲讲echarts的使用方法,有一定的参考价值,感兴趣的朋友可以看看.以饼状图 ...
记录uni.app开发微信小程序中地图的使用,以及项目中的解决办法
标题先讲一下需求:需要获取用户的地址信息以及经纬度,并在地图中展示时出来 uniapp官方也提供了api uni.getLocation(OBJECT) getLocation只能获取用户的经纬度,不 ...
【Linux常见指令】记录一些机器学习中常用的指令(自用，持续更新)
文章目录前言一.Conda 创建环境二.Sudo 命令 1.安装g++/gcc 2.查找文件 3.软连接三.pip 安装 1.安装requirements.txt 2.清华源安装四.git ...
【HMS Core】统一扫码服务中的RemoteView如何修改视图比例？
1.问题描述项目中有一个需求:将扫码视图设置为正方形. 详情如下图所示: 目前默认的视图是按屏幕比例展示的,将视图设置为正方形时,视图的Y轴将会被压缩,现在的问题是: 该View是否支持自定义比例展 ...
uniapp修改data数据后页面未更新渲染
如下代码块,根据打印的结果,mediaList数据已经被修改,但是页面没有渲染出来 _this.mediaList[index].currentTime = hxt.formatSeconds(_th ...
eclipse无法生成class文件，servlet修改后未更新，总是重启服务器
学习了下servlet, 一个简单的例子就搞了半天,总是报各种奇葩的错误. 1.问题描述: 菜单栏中Project下有的选项为灰色,如Build Project(开发中经常用到的) 解决方案:把Bui ...
vue插槽solt ，uni.app
一.什么是插槽? 插槽就是子组件提供给父组件使用的一个占位符,用<slot></solt>表示父组件可以在这个占位符中填充任何模板代码. 二.插槽的用法 1.创建一个子组件,在 ...

记录 uni-app 中对 data 的修改视图未更新的坑

记录 uni-app 中对 data 的修改视图未更新的坑相关推荐

最新文章

热门文章