最近在开发一个小程序项目时,碰到一个问题, 在一个多条件单项选择中,为选中条件添加一个选中状态,选中状态为灰色背景,但是这个背景要用到背景图片 大家都知道在小程序 中wxss是无法读到本地图标资源,只能使用外部链接和base64, 这俩种方法都不适合我们开发的时候使用, 但是却可以在wxml中使用style="background-image: url(../../images/workingMode/pattern-ac.png);"方法 然后通过条件判断来控制是否渲染 但是在小程序

在微信小程序中实现视频的播放与暂停 需求: 视频列表中只能有一个视频在播放 点击视频实现播放与暂停功能 加载完成显示图片,点击后变为视频播放 从上次播放的位置进行播放 思路: 定义一个标记变量,控制视频的播放与暂停 true => 本次问播放 false => 本次为暂停 每次点击后,更新data中视频的id值 声明一个数组,用于存放播放视频的id和播放时间 { vid:xxx, currentTime:xxx } 事件的流程图 代码实现: 静态 <!-- 使用scroll-view组件

平时工作中经常遇到开始只显示几行文字,点击按钮,可以查看全部文字内容. 简单写了个,代码如下: <view class="item_content f28 gray"> <view class="{{isShow?'max3':''}}"> 一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了.一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了.天津公司和我们另一个公司2有

自古开篇先说两句,写这些笔记不是学习用的,主要是后续分享一些遇到的坑,碰到过什么样的问题,怎么去解决,如果你不是一个很耐心无看文章的人,建议去 网易云课堂找一些课程,跟着别人的脚步或许会更有动力,我的笔记也是从哪里学习,记一些小笔记,我觉得大学里做这件事是最合适的了,当然最重要的是有没有兴趣,如果没有兴趣,就别把它当场一个学习的任务,找一项真正自己感兴趣的,去深度了解,做到很精才是真正有意义的事 微信小程序-01-项目组成文件介绍 官方文档: https://developers.weixin.

微信小程序-02-项目文件之间配合和调用关系 我就不说那么多了,我是从官方文档拷贝的,然后加上一些自己的笔记,不喜勿喷 官方文档:https://developers.weixin.qq.com/miniprogram/dev/index.html?t=18090718 小程序的启动 微信客户端在打开小程序之前,会把整个小程序的代码包下载到本地 紧接着通过 app.json 的 pages 字段就可以知道你当前小程序的所有页面路径: { //项目中所有页面的路径,不要后缀名,当然省掉的是: .w

wx:if 与 hidden 都可以控制微信小程序中元素的显示与否. 区别: wx:if 是遇 true 显示,hidden 是遇 false 显示. wx:if 在隐藏的时候不渲染,而 hidden 在隐藏时仍然渲染,只是不呈现. 所以如果频繁切换的话,用 wx:if 将会消耗更多资源,因为每次呈现的时候他都会渲染,每次隐藏的时候,他都会销毁. 如果切换并不频繁的话,用 wx:if 相对来说较好些,因为它会避免初始就一下渲染那么多. wxml: <view> <text>page

条件渲染 顾名思义所谓的条件渲染,就是通过条件来判断是否需要渲染该代码块.条件渲染主要是用到wx:if 和 block wx:if 这两个,第一个相信好理解,第二个是在block里面进行条件渲染,这里我们特别说明一下< block/>并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性.和我们以前的逻辑编程类似,既然有了wx:if ,那么我们也会有wx:elseif和wx.else,这几个组合起来,可以使条件渲染更加灵活. 在这里官方文档中提到了一个wx:if和hidd

这两天开发微信小程序,在设置背景图片时,发现在wxss里面设置 background-image:(url) 属性,不管是开发工具还是线上都无法显示.经过查资料发现,background-image 只能用网络url或者base64图片编码 , 本地图片只能用 image标签src属性才行.当然 image标签src属性也可以使用网络url或者base64图片编码. 下面通过 image 标签src属性设置,实现背景图显示 界面结构: <view class='set-background'>

微信小程序并没有提供列表控件,所以也没有iOS上惯用的列表项左滑删除的功能,SO只能自己干了. 原理很简单,用2个层,上面的层显示正常的内容,下面的层显示一个删除按钮,就是记录手指滑动的距离,动态的来移动上层元素,当然上层用绝对定位. wxml: <view class="container"> <view class="record-box" data-datetime="{{record.datetime}}" wx:for

一.UI介绍 所谓的UI(user Interface)开发指的就是小程序应用界面的开发,在小程序开发框架中会为我们提供一系列的基础组件,例如HTML开发中为我们所提供的一些最基础的标签.需要注意的是微信小程序的标签所遵循的方式是严格的XML语法.二.基础内容组件 <!-- 微信基础内容组件 --> <view> <!-- icon的类型,有效值:success, success_no_circle, info, warn, waiting, cancel, download

小程序事件绑定 https://developers.weixin.qq.com/miniprogram/dev/framework/view/two-way-bindings.html 1.数据 // pages/story/story.js Page({ data: { num:0 }, // 输入框的input事件的执行逻辑,将输入的值赋值给num handleInput(e){ this.setData({ num:e.detail.value }) }, // 加减按钮事件的逻辑 ha

tabBar不显示 在app.json中配置了4个页面,在tabBar的list中随意写了两个页面,编译后发现不能显示tabBar. { "pages": [ "pages/musicList/musicList", "pages/test/test", "pages/index/index", "pages/logs/logs" ], "window": { "backgro

<view class="meiti" style="background-color:red;"> <image src="http://10.0.0.171:9001/images/2017/0619/20170619110943813_progressive.jpg" mode="widthFix" style="width:100%;background-color:black;"

从年初开始,打开小程序,工具栏都会弹出这个提醒: 也就是,默认不弹出授权询问框,默认获取不到用户信息(头像.昵称等)! 如果你需要用到这个接口,可以尝试以下方法: 1.用 button 组件,将属性名 open-type 设置为 getUserInfo 类型,来吊起授权窗口,获取用户基本信息,查看 button 文档 <button open-type="getUserInfo" bindgetuserinfo="onGotUserInfo">授权用户信

js中: onLoad:function(options) { this.setData({ orderstate:'待送检' }) },   WXML中: <view wx:if="{{orderstate}} = '待送检' " >   若不是待送检,则显示不出来 <view>取消送检</view> </view>

未开考 .已交卷. 考试中 .考试结束 #ddd      #f00     #ff0    默认禁用色 禁用的button仅有style起作用,四个状态,通过wx:if ... elif ... elif ... else 来进行判断并且显示(仅能展示一个状态).

<view style='width:100%;height:100%;text-align:center;' class="picture-2">   <image style='width:94.5%;' class="infoImage" src="/pages/image/2.jpg" mode='widthFix'></image> <view>

lastUpDate: 2018-8-12 请把请求地址加入到downLoadFile 提示:首先得要在公众号设置对应的downLoadFile地址. downImg : 下载图片 wxml js downImg: function(e) { var _this = this; // 获取图片地址(http://www.playsort.cn/...) var img = e.currentTarget.dataset.src; // 下载监听进度 const downloadTask = wx

前言: 因为前段时间一直在做关于微信小程序方面的项目,作为一名后端的攻城狮而言做一些简单的前端页面数据操作和管理还是比较容易快上手的,当然前提是要理解微信小程序的基本语法和请求原理.该篇博客主要记录的是在编写微信小程序时使用比较频繁,实用的一些方法和一些基本原理的概括.个人觉得把这些方法掌握好了,开发一个小型的微信小程序那是绰绰有余的啦.当然我这里并没有深入的对一些语言进行详细的概述,纯属个人总结,假如需要详细的微信小程序语法文档请移驾到:[https://developers.weixin.q

1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599 3:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html 4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源

作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 张小龙全面阐述小程序,定档1月9日上线(附90分钟演讲全文) ... 前言:新人第一坑,跳坑指南:修改后,必须保存:ctrl+S: 一:推荐地址集合:(初入门者请先看这里) 1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=147643467