原生微信小程序数据渲染
一直在写vue,第一次接触微信小程序,还是原生,最开始做的时候真的很闹心啊啊啊啊啊啊啊啊啊啊啊啊!!
所以最近大概更新的都是微信小程序原生的内容了~~
么么哒!!一定会继续努力的!!
tips:在小程序项目中,app.json文件里的
{
//页面配置路径
"pages":[
"page/index/index", //默认首页
"page/index/logs",
]
}
正题:微信小程序原生数据渲染
条件渲染:wx:if wx:elif wx:else
用法与vue的v-if v-else if 和v-else 相同,但是当写进标签中时,需要{{}}
eg
<view wx:if="{{ age >=18 }}">成年</view>
<view wx:elif="{{ age <16}}">青春期呢</view>
一个条件控制多个元素显示
block标签,本身不显示,可以简化代码
eg
<block wx:if="{{ age >=18 }}" >
<view>是成年</view>
<view>可以去网吧了</view>
</block>
hidden可以根据条件来决定是否显示某元素
eg
<view hidden="false">你好看得见我吗</view> //不显示
<view hidden="true">你好看得到我了吧</view> //显示
hidden 和wx:if的区别就类似于vue中的v-if 和v-show
小程序中的数据遍历
遍历数组:
<view wx:for="{{users}}">
<text>{{index +1}}</text> //数组的索引值
<text>{{item.name}}</text> //数组中对象的key值name
//默认item是单元值
</view>
微信小程序的事件绑定
bind:tap
原生微信小程序数据渲染的更多相关文章
- Taro -- 原生微信小程序转taro
微信小程序转Taro (转发https://nervjs.github.io/taro/docs/taroize.html) Taro 可以将你的原生微信小程序应用转换为 Taro 代码,进而你可以 ...
- 微信小程序-列表渲染多层嵌套循环
微信小程序-列表渲染多层嵌套循环 入门教程之列表渲染多层嵌套循环,目前官方的文档里,主要是一维数组列表渲染的案例,还是比较简单单一,给刚入门的童鞋还是无从入手的感觉. <view wx:for= ...
- 微信小程序数据请求方法wx.request小测试
微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...
- 微信小程序 -- 数据请求
微信小程序 -- 数据请求 微信小程序请求数据,并不是一个可以在url打开有数据就可以拿到数据那么简单 浏览器地址输入 可以获取参数的url 微信小程序中 代码展示 wxml <view> ...
- flume采集微信小程序数据
flume采集微信小程序数据 flume收集前端埋点数据[1]POST请求http://f.x.com:50000数据格式: JsonArray数据格式示例:[{ "headers" ...
- 如何在原生微信小程序中实现数据双向绑定
官网:https://qiu8310.github.io/minapp/ 作者:Mora 在原生小程序开发中,数据流是单向的,无法双向绑定,但是要实现双向绑定的功能还是蛮简单的! 下文要讲的是小程序框 ...
- 高大上的微信小程序中渲染html内容—技术分享
大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题.但是,在微信小程序(下文简称为「小程序」)中,应当如何渲染这部分内容呢? 解决方案 wxP ...
- 微信小程序-数据缓存
每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorage(wx.setStorageSync).wx.getStorage(wx.getStorageSync).wx.clearSt ...
- mpvue学习笔记-之微信小程序数据请求封装
简介 美团出品的mpvue已经开源出来很久了,一直说要进行一次实践,这不最近一次个人小程序开发就用上了它. 看了微信官方的数据请求模块--request,对比了下get和post请求的代码,发现如果在 ...
随机推荐
- thinkphp 模板注释
模板支持注释功能,该注释文字在最终页面不会显示,仅供模板制作人员参考和识别. 大理石平台厂家 单行注释 格式: {/* 注释内容 */ } 或 {// 注释内容 } 例如: {// 这是模板注释内容 ...
- php抓取远程数据显示在下拉列表中
前言:周五10月20日的时候,经理让做一个插件,使用的thinkphp做这个demo 使用CURL抓取远程数据时如果出现乱码问题可以加入 header("content-type:text/ ...
- echarts折线区域图
一.使用场景 当舒张压和收缩压超过或低于他们对应的范围时,折线应该给与不同颜色.两个指标对应的范围也要填充不同的颜色. 二.实现方案 主要使用了echarts中的visualMap,series.ma ...
- 后缀自动机XJ
后缀自动机初探(xiajiang) 后缀树\((Suffix Tree)\) 对于一个字符串,把它的所有后缀插入到\(Trie\)中就是一个后缀树. 当然字母存在边上,最终的点可以用一个特殊符号如:\ ...
- day 51 阿里iconfont的使用
阿里iconfont的使用 1. 找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中 ...
- 基于token的验证
认证.权限和限制 身份验证是将传入请求与一组标识凭据(例如请求来自的用户或其签名的令牌)相关联的机制.然后 权限 和 限制 组件决定是否拒绝这个请求. 简单来说就是: 认证确定了你是谁 权限确定你能不 ...
- threading线程中的方法(27-11)
t1.start() # 执行线程 t1.join() # 阻塞 t1.setDaemon(True) #守护线程 threading.current_thread() # 查看执行的是哪一个线程 t ...
- map 与 lambda 的用法
# 列表中的每个元素进行*2lis = [10, 30, 70]f = map(lambda li: li*2, lis) # 操作lis中的每个元素.print(list(f)) # 返回来一个新的 ...
- DEDECMS织梦后台更新网站栏目无反应一键更新无响应的解决方法
很多站长朋友反应,经常会遇到DEDECMS织梦后台更新网站栏目无反应和一键更新无响应的问题,这个问题的所在就是在于恢复了数据或者覆盖了织梦后台文件之后,点击一键更新完全没反应,或者生成栏目的时候其他都 ...
- 网站PC端和移动端,用户通过设备识别
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <!--<me ...