文档章节

微信小程序把玩(七)数据绑定

Mr韦淋
 Mr韦淋
发布于 2017/05/07 20:22
字数 441
阅读 1
收藏 0
点赞 0
评论 0

这里写图片描述

数据绑定有一部分前几个看着还行,后面的几个可能有几个不理解,界面展示的数据有的也因为条件没法显示。看不懂的可以先记着,后面真正用到时就会明白,反正我是这样想的。这里先记录下

data.wxml

<!--数据绑定使用对象---内容--> <view>{{message}}</view> <!--数据绑定使用对象---组件属性---需要在双引号之内--> <view id="item-{{id}}">组件属性</view> <!--数据绑定使用对象---控制属性---需要在双引号之内--> <view wx:if="{{condition}}">控制属性</view> <!--数据绑定使用对象---三元运算--> <view hindden="{{flag ? true : false}}">三元运算符</view> <!--数据绑定使用对象---算数运算--> <view>我是运算结果---{{a + b}} + {{c}} + d</view> <!--数据绑定使用对象---逻辑判断--> <view wx:if="{{length > 5}}">asdf</view> <!--数据绑定使用对象---字符串运算--> <view>{{"Hello " + name}}</view> <!--数据绑定使用对象---数组组合--> <view wx:for="{{[zero, 1, 2, 3, 4, 5, 6]}}">{{item}}</view> <!--数据绑定使用对象---对象--> <template is="objectCombine" data="{{for: x, bar: y}}"></template> <!--数据绑定使用对象---扩展运算符对象 ... 将一个对象展开--> <template is="objectCombine" data="{{...obj1, ...obj2, p: 5}}"></template> <!--数据绑定使用对象---对象的key和value相同时--> <template is="objectCombine" data="{{foo, bar}}"></template>

data.js

Page({
  data:{

    //内容绑定
    message: 'Hello WeApp',

    //组件属性绑定
    id: 0,

    //控制属性绑定
    condition: true,

    //三元运算
    flag:false,

    //算数运算
    a: 1,
    b: 2,
    c: 3,

    //逻辑判断
    length: 6,

    //字符串运算
    name: '顺子',

    //数组组合
    zero: 0,

    //对象

    x: 0,
    y: 1,

    //对象展开
    obj1: {
        a: 1,
        b: 2
    },
    obj2: {
        c: 3,
        d: 4
    },
    p: 5,

    //对象key和value形同时
    foo: 'my-foo',
    bar: 'my-bar'



  },
})

本文转载自:http://blog.csdn.net/u014360817/article/details/52652011

共有 人打赏支持
Mr韦淋
粉丝 2
博文 80
码字总数 23114
作品 0
江门
高级程序员
Taro实践 - 快速开发【知乎】多端应用

来自团队小伙伴 - 阿集,关于 Taro 上手实践的一篇文章,希望对大家的使用有所帮助。 1. Taro 简介 是由凹凸实验室打造的一套遵循 语法规范的多端统一开发框架。 使用 ,我们可以只书写一套代...

凹凸实验室
06/27
0
0
微信小程序 [获取登录用户信息,重点openID(详解)]

♩ 背景 其实这篇文章几个月前就写完了,但是这段时间,微信小程序官方文档有了更新,同事在我自己的实际操作过程中,发先之前写的过于繁杂,所以现在进行简化梳理,欢迎指摘. 语言框架:Thi...

moTzxx
昨天
0
0
微信小程序运行流程看这篇就够了

一.微信小程序是啥 本质其实就是(混合)的app 介于web app与native 原生app之间,具备丰富的调用手机各种功能的接口,同时又具备灵活性,跨平台 1. 运行环境差异 微信小程序运行在三端:iOS...

05/17
0
0
米8抢到没?不急,撸个小程序先😎

前言 小程序发布以来,凭借无需安装、用完即走、触手可及、无需注册、无需登录、以及社交裂变等多个优势,一路高歌,变得愈来愈火爆,它革命性的降低了移动应用的开发成本,也正好迎合了用户...

云中玉卷
06/12
0
0
微信小程序评论插件 - WxComment

WxComment 是一个微信小程序的评论插件,结合BaaS提供商LeanCloud,无需其他另外的个人或者云服务器,就可以免费使用。解决了需要个人去注册域名、备案、购买云服务器的繁杂问题。 特色 独立...

yicm
05/24
0
0
微信小程序商店 | 即速商店_小程序流量平台

微信小程序商店 | 即速商店 即速应用商店-分类最齐全的微信小程序商店,收录当前最新最热门小程序,汇集各行业小程序案例及评测,在这里可以轻松找到各种实用好玩的小程序,也可 免费发布 自...

jisuapp
02/08
0
0
Promise.all 应用一例

在做小程序地图开发的时候,需要在地图上放置不同图标的 ,而这些图标又来自网络,恰恰由于微信小程序的限制,不支持网络图片作为 的 值 微信小程序文档 但注意到也支持临时路径这句话,则可...

lip2up
03/29
0
0
为何我们要用 React 来写小程序 - Taro 诞生记

在互联网不断发展的今天,前端程序员们也不断面临着新的挑战,在这个变化多端、不断革新自己的领域,每一年都有新的美好事物在发生。从去年微信小程序的诞生,到今年的逐渐火热,以及异军突起...

凹凸实验室
06/25
0
0
云+社区小程序知识周,等你来挑战!

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 云+社区,致力于打造云计算技术生态圈,帮助开发者提高技术影响力。 本次云+社区小程序知识周,致力于促进小程序开发者分享小程序...

腾讯云+社区
06/26
0
0
618快要来临--家具大战一战即发

前言 今年是小程序很火的一年,所以最近在自学微信小程序,所以打算自己撸一个小程序出来,由于自己才刚刚自学不久。就做了一个相对简单的家具小程序。当然在这其中也遇到了一些问题和bug,在...

盏茶作酒 流苏如画
06/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

CoreText进阶(五)- 文字排版样式和效果

CoreText进阶(五)- 文字排版样式和效果 效果 以下是三个设置了不同属性的效果图 第一个设置了文字颜色为红色,字体为16号 第二个设置了文字颜色为灰色,字体为16号,对其为居中 第三个设置...

aron1992
23分钟前
1
0
10.23 linux任务计划cron~10.27 target介绍

crontab命令被用来提交和管理用户的需要周期性执行的任务,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务工具,并且会自动启动crond进程,crond进程每分钟会定期检查是...

洗香香
33分钟前
0
0
告警系统主脚本、告警系统配置文件、告警系统监控项目

20.20 告警系统主脚本 告警系统主脚本 main.sh内容 #!/bin/bash#Written by aming.# 是否发送邮件的开关export send=1# 过滤ip地址export addr=`/sbin/ifconfig |grep -A1 "en...

lyy549745
37分钟前
0
0
Don’t Repeat Yourself

在软件工程中,Don’t Repeat Yourself(DRY)是软件开发的原则,旨在减少重复,用抽象代替它,使用数据规范化来避免冗余。 这个原则在维基百科上是说是由Andy Hunt和Dave Thomas《The Pragmat...

woshixin
39分钟前
0
0
搭建webpack项目框架

作者:汪娇娇 时间:2018年6月4日 一、说明 随着业务发展和前端人员的增加,搭建一个通用框架以及制定统一规范就成了必然。对于选型这方面,一开始好像就没考虑其他框架,直接选了webpack。w...

娇娇jojojo
46分钟前
0
0
Java基础——面向对象(内部类)

声明:本栏目所使用的素材都是凯哥学堂VIP学员所写,学员有权匿名,对文章有最终解释权;凯哥学堂旨在促进VIP学员互相学习的基础上公开笔记。 内部类: 1.有名内部类 2.无名内部类 内部类申请...

凯哥学堂
54分钟前
0
0
HttpClient内部三个超时时间的区别

RequestConfig requestConfig = RequestConfig.custom() .setConnectionRequestTimeout(config.connReqTimeout) //从连接池中获取连接的超时时间 ......

1713716445
今天
0
0
每天一个命令SCP

每天一个命令:SCP scp是secure copy的简写,用于在Linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进行拷贝不能跨服务器,而且scp传输是加密的。可能会稍微影响一下速...

河图再现
今天
0
0
cron/chkconfig/systemd/unit/target

linux任务计划 : cron工具 任务计划在运维工作中用到的比较多,大部分系统管理工作都是通过定期自动执行某个脚本来完成。 查看linux中任务计划的配置文件: /etc/crontab [root@yolks-001 ~]...

Hi_Yolks
今天
1
0
ftp攻略

Vsftpd完全攻略(一)ftp原理与vsftp安装:https://www.iyunv.com/thread-44698-1-1.html Vsftpd完全攻略(二)设置匿名用户也支持下载和上传与创建目录:https://www.iyunv.com/forum.php?mo...

寰宇01
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部