小程序转uniapp之setData

在小程序中,我们可以使用this.setData()方法来更新页面的数据。而在Uni-app中,我们可以使用this.$set()方法来更新页面的数据。两者之间的使用方法略有不同。

在小程序中,this.setData()接受一个对象参数,可以更新页面中的多个数据字段。示例如下:

复制代码
this.setData({
  a: 1,
  b: 'hello',
  c: true
})

而在Uni-app中,this.$set()接受两个参数,第一个参数是要更新的数据字段的路径,第二个参数是要更新的值。示例如下:

复制代码
this.$set(this.data, 'a', 1)
this.$set(this.data, 'b', 'hello')
this.$set(this.data, 'c', true)

需要注意的是,在Uni-app中,我们需要使用this.data来访问页面的数据对象。另外,Uni-app中也支持使用this.setData()方法来更新数据,但推荐使用this.$set()方法来更新数据,因为它更符合Vue的数据更新机制。

总结一下,小程序中的this.setData()对应Uni-app中的this.$set(),两者都可以用来更新页面的数据。在Uni-app中,推荐使用this.$set()方法来更新数据。

setData:function (datas){

let _this = this

for(let key in datas){

console.log(key,datas[key])

_this[key] = datas[key]

}

},

相关推荐
lsp程序员0102 小时前
使用 Web Workers 提升前端性能:让 JavaScript 不再阻塞 UI
java·前端·javascript·ui
J***Q2922 小时前
前端路由,React Router
前端·react.js·前端框架
1***81532 小时前
前端路由参数传递,React与Vue实现
前端·vue.js·react.js
q***13613 小时前
十七:Spring Boot依赖 (2)-- spring-boot-starter-web 依赖详解
前端·spring boot·后端
xixixi777774 小时前
了解一下Sentry(一个开源的实时错误监控平台)
前端·安全·开源·安全威胁分析·监控·sentry
Keely402855 小时前
学习编写chrome插件:Hello World 扩展
前端·chrome
hhcccchh5 小时前
学习vue第三天 Vue 前端项目结构的说明
前端·vue.js·学习
源力祁老师6 小时前
Odoo 19 制造与会计集成深度解析
前端·javascript·制造
iFlow_AI6 小时前
iFlow CLI Hooks 「从入门到实战」应用指南
开发语言·前端·javascript·人工智能·ai·iflow·iflow cli