百度小程序Toast组件 author: @TiffanysBear 百度小程序自定义通用toast组件 BdToast百度小程序自定义通用组件-github地址 需求 手百小程序的toast仅支持在页中展示,不能自定义位置.字体大小.在单个文本中增加icon等需求:因此自定义一个全局可通用的Toast. 效果预览 如何使用 代码目录位于 /widget/toast 下,包含3个文件 toast.js 脚本代码 toast.css 样式文件,可以根据自己需求定制 toast.swan 模板结构,

给客户开发一个百度小程序,有个地图定位显示.百度小程序内置的api地图是不准的,通过百度一下,查询到坐标偏移算法公式,自己项目中使用,手机测试坐标已经正常显示! 经纬度,通过百度坐标拾取器拾取到! .swan文件 <map id="myMap" style="width:100%;height:50vh;" longitude="{{longitude}}" latitude="{{latitude}}" scale=&

.swan <!-- 轮播图S --> <view class="swiper-box"> <swiper class="banner" style='height:{{swiperH}}' bindchange="swiperChange" autoplay="true" interval="3000" duration="500" circular=&q

百度智能小程序自定义弹窗组件wcPop|百度小程序model对话框|智能小程序弹窗界面模板 最近百度也推出了自己的智能小程序,如是就赶紧去试了下,官方提供的api还不是狠完整.而且官方提供的弹窗组件也不能满足一些复杂展示场景,所以就自己动手封装了个智能小程序弹窗wcPop自定义模板插件. 百度智能小程序wcPop支持多种动画展示形式,超精简调用api,可自定义多按钮事件,随意自定义弹窗模板内容. 智能小程序弹窗demo展示: 插件调用api超简洁,易于上手,只需在需要调用的页面引入tpl.js即

概述 今天在网上突然看到iView新出了一个微信小程序的组件库iView Weapp,自己就上手试了一下,发现用起来还是不错的,把自己使用的过程与大家分享下. 一 预览iView组件 1.可以在手机上扫码查看这个组件,但是我们想使用哪一个组件是什么样的,就需要在手机上看这个组件是什么样的,其实这样挺麻烦的,不过我还是把二维码给放过来吧. 2.就是在web微信开发者工具中查看,首先去github上下载,下载地址:https://github.com/TalkingData/iview-weapp,

官方文档  binderror HandleEvent 当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong'} 在微信小程序开发中,我们使用列表包含图片,如果这个图片链接404错误,那么我们应该给它提供一个默认的友好URL地址.html和js中使用onerror事件就可以了 <img src="image.gif" onerror="this.src='https:w.chesu

不久前微信小程序发布了web-view组件,这个消息在各个圈里引起不小的涟漪.近期正好在做小程序的项目,便研究了一下这个让大家充满期待的组件.   1,web-view这个组件是什么鬼? 官网的介绍:web-view 组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面.简单来说,这个组件是一个和当前页面一样大小的容器,容器里显示的是属性src引用的url的内容.类似于html中的iframe框架.不同的是iframe可以自定义大小边框等样式,webview自动铺满整个小程序页面.   2

这个问题是小程序input组件的bug,目前的解决办法可以,在input标签上加一个其他标签,显示placeholder内容,获得焦点时消失,失去焦点时候再让其显示 <view class='input-box'> <input placeholder='' class='inputtext' maxlength='11' type="number" bindinput="bindKeyInput" bindblur="blurinput

使用小程序的组件map时 在开发者工具上一切顺利 但是在真机预览时 发现地图的层级是最高的 任何标签都覆盖不了它 调整z-index值并没有什么效果 原因是 微信小程序的map.video.canvas.camera等组件都是原生组件,层级是最高的,并不能像原生开发那样使用z-index来控制层级. 从1.4.0基础库中增加了一个组件cover-view,用于在map.video.canvas.camera等原生组件上显示基础原生视图. 但是用了cover-view这个组件之后 我又发现了一个问

今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段代码. wxml文件放个text <text>second: {{second}} micro second:{{micro_second}}</text> 在js文件中调用 function countdown(that) {  var second = that.data.seco

百度小程序button去掉默认边框: button::after{ border:none; }

本文转自:https://www.cnblogs.com/-nothing-/p/7910355.html 1,web-view这个组件是什么鬼? 官网的介绍:web-view 组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面.简单来说,这个组件是一个和当前页面一样大小的容器,容器里显示的是属性src引用的url的内容.类似于html中的iframe框架.不同的是iframe可以自定义大小边框等样式,webview自动铺满整个小程序页面.   2,这个组件能给我们带来什么? 小程序的页

问题一: 使用微信小程序input组件时,在移动端唤起focus或blur事件时,因光标占位导致内容出现叠影及抖动现象. 解决方案: 用<textarea>组件代替了<input/>组件,并给textarea设置了宽度值 问题二: 使用textarea组件时,当在移动端初次focus,原本应在内容末尾的光标,向左移动了一个位置 解决方案: 在设置textarea自带光标相关属性cursor.selection-start.selection-end无效后,在textarea属性中添

小程序 video 组件同层渲染公测   各位开发者: 大家好. 小程序原生组件因脱离 WebView 渲染而存在一些使用上的限制,为了方便开发者更好地使用原生组件进行开发,我们对小程序原生组件引入了 同层渲染 模式.通过同层渲染,小程序原生组件可与其他内置组件处于相同层级,不再有特殊的使用限制. 现阶段,小程序 video 组件 已切换至同层渲染模式.在该模式下,video 组件可以做到: 1.直接通过 z-index 属性对 video 组件进行层级控制: 2.无需使用 cover-view

推荐3个小程序开源组件库 在进行小程序开发时,经常会遇到编写组件方面的阻碍,这让我们花费大量的时间在页面以及 CSS 样式编写上.因此可以使用开源组件库,有些复杂的组件可以直接拿来使用,节省开发时间,避免重复造轮子. Vant 由「有赞」团队维护的开源项目,目前 GitHub 上有 8057 颗 ⭐.Vant 提供了一整套 UI 基础组件和业务组件,通过 Vant 可以快速搭建出风格统一的页面,提升开发效率.除了一些常用的 UI 组件,Vant 还提供了一些适用于商城小程序的业务组件,例如省市区

据粗略预估,微信小程序和百度小程序,有至少90%以上的相似代码,而且api的参数和返回的数据都是一致的,有一些不一致的将做如下介绍:.wxml文件,改成后辍名.swan.wxss文件,改成后辍名为.cssjs文件中的wx.改成swan.wxml文件中的渲染语句的wx:改成s-.这样基本会将大部分的微信小程序直接转换成百度小程序

开发微信小程序的过程中,选择一款好用的组件库,可以达到事半功倍的效果.自从微信小程序面世以来,不断有一些开源组件库出来,下面5款就是排名比较靠前,用户使用量与关注度比较高的小程序UI组件库.还没用到它们的你,可以关注和了解一下哦! WeUI WXSS WeUI WXSS是腾讯官方UI组件库WeUI的小程序版,提供了跟微信界面风格一致的用户体验. GitHub地址:https://github.com/Tencent/weui-wxss npm下载:npm i weui-wxss     iVie

概述 自己封装的一个比较简单微信弹窗小组件,主要就是教会大家对微信小组件的用法和理解,因为微信小程序对组件介绍特别少,所以我就把自己的理解分享给大家 详细 代码下载:http://www.demodashi.com/demo/13177.html 一.前言 相信大家在开发小程序时会遇到某个功能多次使用的情况,比如弹出框.这个时候大家首先想到的是组件化开发,就是把弹出框封装成一个组件,然后哪里使用哪里就调用,对,看来大家都是有思路的人,但是要怎样实现呢.可能你会去看官方文档,但是微信的官方文档也是

小程序scroll-view组件使用时,子元素虽设置样式display:inline-flex;whit-space:nowrap

转自:https://idig8.com/2018/08/11/xiaochengxu-chuji-23/ 开始了解下小程序的组件.源码:https://github.com/limingios/wxProgram.git 中的No.10 组件 多个组件构成一张视图页面>经过样式和布局,页面其实理解成html 组件包含<开始标签></结束标签> 每个组件都包含一些公用属性 官方的阐述 https://developers.weixin.qq.com/miniprogram/d