微信小程序----关于变量对象data 和 前端wxml取后台js变量值
(一)页面变量对象data
对象data 有两个方面用途
第一,前端wxml的数据渲染是通过设置此对象中定义的变量进行关联展现的
第二,定义JS页面中的页面局部变量,使其整个页面中可使用或调用
对象data定义的变量支持各种数据类型,string,int,[],{}
第一.wxml数据渲染,只要通过设置data值(this.setData({...}))即可
如:
wxml页面:detail对象中包含有TaskBillCode与BillDate两个属性
js页面:
第二.页面变量
定义:
存储:
使用:
(二)前端wxml取后台js变量值
1.js后台只能通过设置Data里的变量值( this.setData({}) ),前台wxml才能得到渲染 wxml以双括号取变量值 {{ var }}
JS:
设置变量值 :
WXML:
2. 列表渲染,即数据List 用循环进行渲染 wx:for="{{ taskItems}}" 默认子项为item
3.关于多数据的数据类型,目前wxml取变量只支持数组,并不支持对象
这里面的billStatus 只能定义为数组类型,才能支持wxml用变量取数组的值
data {
billStatus:[]
}
如定义为下面这样
data {
billStatus:{}
}
则会导致 {{billStatus[item.Status]}} 取不到值 ,但代入数值还是可以取到 {{billStatus[1]}}
4.关于在全局里app.js定义数组
两种方式
一种是直接在全局变量对象中定义,但这样是指定不了下标的,下标只能从默认的0开始
别一种则是在全局变量对象中只定义动态数组变量,在加载后赋值 这样是能达到指定下标变量名的效果
微信小程序----关于变量对象data 和 前端wxml取后台js变量值的更多相关文章
- 微信小程序实现显示和隐藏控件-头像-取值-bindblur事件
微信小程序实现显示和隐藏控件 .wxml: <view class=" {{showOrHidden?'show':'hidden'}}"></view> ...
- 微信小程序存放视频文件到阿里云用到算法js脚本文件
peterhuang007/weixinFileToaliyun: 微信小程序存放视频文件到阿里云用到算法js脚本文件 https://github.com/peterhuang007/ ...
- 微信小程序 navigateTo 传对象参数
当微信小程序navigateTo传入参数是个object时,请使用JSON.strtingify将object转化为字符串,代码如下: wx.navigateTo({ url: '../sendChe ...
- 微信小程序----没有 DOM 对象,一切基于组件化 ---- mpvue
封装好用的 类库 和 组件,复用且灵活度高 抽取相同的部分放在函数内部(组件内部) 抽取不同的部分放在形参(组件 props 传参,或者插槽) new Promise 运行时 初始化实例对象的状态为 ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- uniapp微信小程序获取当前用户手机号码(前端)
按钮触发获取用户信息 uniapp中与微信小程序官网所写会不同, <button open-type="getPhoneNumber" @getphonenumber=&qu ...
- 微信小程序:POST请求data数据请求不到
最近开始开发小程序,遇到许多小问题,直奔主题. wx.request()是微信封装的ajax请求方法,也是小程序中ajax唯一的一个方法,被放在了API文档的第一个位置,的确使用率是最高的. 但是wx ...
- 微信小程序填坑之旅(1)-app.js中用云开发获取openid,在其他页上用app.globaldata.openid获取为空
参考:小程序如何在其他页面监听globalData中值的变化?https://www.jianshu.com/p/8d1c4626f9a3 原因就是:app.js没执行完时,其他页已经onload了, ...
- 微信小程序,关于设置data里面的数据。
关于设置 data里面的数据 wxml: <view>{{userName}}</view> data: { userName:'张三', } 有两种方法 方法一:直接使用点关 ...
随机推荐
- EasyUi之datagird解读
1.其json格式需要为: JSON Code 1234567891011121314151617181920212223 { , "rows": [ ...
- [转] WebService开发笔记 1 -- 利用cxf开发WebService竟然如此简单
以下文章来自 http://www.blogjava.net/jacally/articles/186655.html 现在的项目中需要用到SOA概念的地方越来越多,最近我接手的一个项目中就提出了 ...
- postgresql 抽样查询
curl -GET 'http://****/query' --data-urlencode "db=db" --data-urlencode "q=SELECT las ...
- 多年心愿,终于完成,热泪盈眶啊。。。Adrew NG 的 机器学习
谢谢Andrew老师!谢谢Coursera!谢谢自己!希望这是一个好的开始!希望自己也能使用机器学习来make a better world...
- 通过条件注释<!--[if IE]><!-->判断浏览器
有时我们会在网站头部看到: <!--[if IE 7]> <![endif]--> 或者 <!--[if lt IE 9]> <![endif]--> ...
- iOS 旋转
实现一张图片的旋转部分角度显示: [cpp] view plaincopy UIImageView image = [[UIImageView alloc]init]; image.frame = C ...
- Matlab笔记
提取RGB分量,并显示出来 rgb=imread('mao.jpg'); rgb_r=rgb(:,:,); rgb_g=rgb(:,:,); rgb_b=rgb(:,:,); zero=zeros(, ...
- javap -s 查看java方法签名
工程先用eclipse生成class目录,转到class目录下执行: javap -s com.example.hellojni.MainActivity Compiled from "Ma ...
- MySQL性能分析及explain的使用说明
1.使用explain语句去查看分析结果 如explain select * from test1 where id=1;会出现:id selecttype table type possible_k ...
- datalog
https://en.wikipedia.org/wiki/Datalog http://www.csd.uoc.gr/~hy562/1112_spring/instr_material/WhatYo ...