(一)页面变量对象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变量值的更多相关文章

  1. 微信小程序实现显示和隐藏控件-头像-取值-bindblur事件

    微信小程序实现显示和隐藏控件 .wxml: <view class=" {{showOrHidden?'show':'hidden'}}"></view> ...

  2. 微信小程序存放视频文件到阿里云用到算法js脚本文件

           peterhuang007/weixinFileToaliyun: 微信小程序存放视频文件到阿里云用到算法js脚本文件 https://github.com/peterhuang007/ ...

  3. 微信小程序 navigateTo 传对象参数

    当微信小程序navigateTo传入参数是个object时,请使用JSON.strtingify将object转化为字符串,代码如下: wx.navigateTo({ url: '../sendChe ...

  4. 微信小程序----没有 DOM 对象,一切基于组件化 ---- mpvue

    封装好用的 类库 和 组件,复用且灵活度高 抽取相同的部分放在函数内部(组件内部) 抽取不同的部分放在形参(组件 props 传参,或者插槽) new Promise 运行时 初始化实例对象的状态为 ...

  5. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  6. uniapp微信小程序获取当前用户手机号码(前端)

    按钮触发获取用户信息 uniapp中与微信小程序官网所写会不同, <button open-type="getPhoneNumber" @getphonenumber=&qu ...

  7. 微信小程序:POST请求data数据请求不到

    最近开始开发小程序,遇到许多小问题,直奔主题. wx.request()是微信封装的ajax请求方法,也是小程序中ajax唯一的一个方法,被放在了API文档的第一个位置,的确使用率是最高的. 但是wx ...

  8. 微信小程序填坑之旅(1)-app.js中用云开发获取openid,在其他页上用app.globaldata.openid获取为空

    参考:小程序如何在其他页面监听globalData中值的变化?https://www.jianshu.com/p/8d1c4626f9a3 原因就是:app.js没执行完时,其他页已经onload了, ...

  9. 微信小程序,关于设置data里面的数据。

    关于设置 data里面的数据 wxml: <view>{{userName}}</view> data: { userName:'张三', } 有两种方法 方法一:直接使用点关 ...

随机推荐

  1. EasyUi之datagird解读

    1.其json格式需要为:  JSON Code  1234567891011121314151617181920212223   {     ,     "rows": [    ...

  2. [转] WebService开发笔记 1 -- 利用cxf开发WebService竟然如此简单

    以下文章来自   http://www.blogjava.net/jacally/articles/186655.html 现在的项目中需要用到SOA概念的地方越来越多,最近我接手的一个项目中就提出了 ...

  3. postgresql 抽样查询

    curl -GET 'http://****/query' --data-urlencode "db=db" --data-urlencode "q=SELECT las ...

  4. 多年心愿,终于完成,热泪盈眶啊。。。Adrew NG 的 机器学习

    谢谢Andrew老师!谢谢Coursera!谢谢自己!希望这是一个好的开始!希望自己也能使用机器学习来make a better world...  

  5. 通过条件注释<!--[if IE]><!-->判断浏览器

    有时我们会在网站头部看到: <!--[if IE 7]> <![endif]--> 或者 <!--[if lt IE 9]> <![endif]--> ...

  6. iOS 旋转

    实现一张图片的旋转部分角度显示: [cpp] view plaincopy UIImageView image = [[UIImageView alloc]init]; image.frame = C ...

  7. Matlab笔记

    提取RGB分量,并显示出来 rgb=imread('mao.jpg'); rgb_r=rgb(:,:,); rgb_g=rgb(:,:,); rgb_b=rgb(:,:,); zero=zeros(, ...

  8. javap -s 查看java方法签名

    工程先用eclipse生成class目录,转到class目录下执行: javap -s com.example.hellojni.MainActivity Compiled from "Ma ...

  9. MySQL性能分析及explain的使用说明

    1.使用explain语句去查看分析结果 如explain select * from test1 where id=1;会出现:id selecttype table type possible_k ...

  10. datalog

    https://en.wikipedia.org/wiki/Datalog http://www.csd.uoc.gr/~hy562/1112_spring/instr_material/WhatYo ...