前端_李嘉豪

现在安卓手机厂商推出了自己 快应用 基于手机桌面类似小程序。今天给大家讲解开发过程中的坎坷经历，首先我们是熟悉了oppo快应用文档，类似于vue语法+小程序api的模式，跟uniapp感觉有相同之处，但是在开发过程中，感觉各方面生态还不是特别成熟，包括开发者工具，文档API及组件及社区都没完全成熟起来。开发起来一步一个坑，所以放弃原生开发，想法直接走捷径。转折点转换工具介绍文档：https://www.npmjs.com/package/qa-adapter当我们开发正出入水深火热之中时，对接技术小

效果:直接使用小程序的swiper组件就可以实现我们要的效果,但是我们注意swiper的高度问题,这是一个坑!先贴上代码<view class="swiper-box"> <swiper current="{{currentNum}}" bindchange='onChange' style='height:{{Hei}}' previousMargin="60rpx" nextMargin="60rpx"> <swiper-i

前言现在安卓手机厂商推出了自己 “快应用” 基于手机桌面的一种类似小程序。今天给大家讲解开发过程中的坎坷经历，首先我们是熟悉了oppo快应用文档，类似于vue语法+小程序api的模式，跟uniapp感觉有相同之处，但是在开发过程中，感觉各方面生态还不是特别成熟，包括开发者工具，文档API及组件及社区都没完全成熟起来。开发起来一步一个坑，所以放弃原生开发，想法直接走捷径。转折点...

数组演示Page({ data: { arr:['小明','小张'] }, onLoad: function () { // 首先我们演示数组 this.setData({ [`arr[1]`]:'小李' }) console.log(this.data.arr) // ["小明", "小李"] }})当...

<view class="index-bd"> <view class="kind-list"> <block wx:for-items="{{list}}" wx:key="{{item.id}}"> <view class="kind-list-item"> &...

<view class='starBox'> <view class='star_item'> <view class='rui-star' wx:for="{{[1,2,3,4,5]}}" wx:key="star1" bindtap='getStar' ...

<div class="bound"></div>.bound { background-color: #3eaaf2; width: 300px; height: 100px; display: flex; flex-direction: column; align-items: center; posi...

侧滑组件代码：<view class='dpfC {{slideNav ? "selectItems-content-show":"selectItems-content-hide"}}' catchtouchmove='ture'> <view class="userInfo" wx:if='{{slideNav}}'> <view...

说到节流，一般是两种方法实现1，一般是通过定时器去延迟执行。2，通过时间戳来控制今天就给大家展示得是时间戳得方法；Page({ data: { tapTime: '', // 防止两次点击操作间隔太快 }, onclick(){ var nowTime = new Date(); if (nowTime - this.data.t...

平时我们用到富文本渲染的时候有一个问题会让我们无从下手，如何给富文本大字符串里的标签添加class样式去控制呢，小编今天教大家一种简单通过的方法；首先我们是用官方自带的富文本渲染标签 <rich-text nodes="{{content}}" bindtap="tap"></rich-text>然后我们下一步进行对富文本进行下一步操作添加class样式...

为了不断更，今天在给大家讲一个小技巧；这个也是粉丝之前问过我的一个问题，在这里分享给大家；有时候为了满足条件我们需要把字符串数组 => 数字数组 代码如下 let strArray = ['1','2','3','4'] //我们要的效果是转成 [1,2,3,4]那么开始表演： let strArray = ['1','2','3','4'] //我们要的效果是...

item.content.replace(/\r?##/g, "")将文本内"##"替换为" "空字符串const app = getApp()Page({ list: [ { content: 'Miji米技便携果汁机(手携按压式)##MB-1200######市场参考价：498元/套######装箱：8套/箱######品牌：Mij...

效果：方法很简单接下来给大家详细讲解,input获取焦点时,可以拿到软键盘的高度,那么问题就好解决了我们只需要拿到这个高度去给input写一个动态的定位样式即可<view class="inputBox" style="bottom:{{bottom}}px">//行内动态绑定样式 <input class="input" ...

由于各种的需求，现在小程序已经开始支持自定义头部导航了，接下来给大家讲接如何实现。一，首先配置自定义导航app.json配置"navigationStyle": "custom" 接下来你会发现 默认的头部没有了；二，开始写我们的自定义导航组件那么问题来了 我们如何定义导航的高度呢，接下来直接上文档，上代码；App({ onShow: function (...

解决方法很简单我们只需在遮罩层元素上添加catch:touchmove 即可遇到同样问题的童鞋不妨试试<view class="Boxshade" catch:touchmove catchtap="ShowList" wx:if='{{isShadeShow}}'></view> //遮罩层帮助到大家的童鞋记得关注小编噢喜欢上方小程...

说起微信支付呢，api文档上已经讲的很清楚了，今天小编在给大家讲的更直白些直接上代码了，看注释即可前台我们只需将后台传递给我们的参数传入即可 wxpay() { let that = this, params = { mid: that.data.mid, //客户ID orde...

保存图片前需要授权，因此我们先授权wx.getSetting({ success(res) { if (!res.authSetting['scope.writePhotosAlbum']) { wx.authorize({ scope: 'scope.writePhotosAlbum', ...

具体思路如下，我们首先要拿到需要吸附元素的据顶部距离，然后再去判断，如果超过了，我们通过判断添加样式即可，如在有不理解的，可以私信小编。<view style="height:100%;position:fixed;width:100%;"> <scroll-view scroll-y="false" bindscroll="scroll" style="heigh...

“微信广告助手”发布声明称，为进一步鼓励和支持原创优质的内容创作者和小程序（小游戏）开发者，2019年6月1日起， 微信小程序流量主和公众号流量主广告收入分成比例政策优化调整，优质流量主将获取更多收益。以下为具体调整方案：1. 小程序（小游戏）广告收入分成比例调优2019年6月1日起，小程序（小游戏）流量主的收入分成比例整体调优，具体调整如下：创意小游戏：单日广告收入流水200万以...

<view class='collectBox' bindtap='addCollect' wx:if="{{write[0]+write[1] > 0}}" bindtouchmove="touchmove" catch:touchmove style="left:{{write[0]}}px;top:{{write[1]}}p...

最近微信小程序的流量主组件更新了，看似更加规范了，却大大打击了开发者的收入。流量主位置布置，可参考以下小程序；

首先我们是需要调用微信wx.getLocation({}) 获取到用户 坐标位置onLoad(){ var that = this; var BMap = new bmap.BMapWX({ ak: app.globalData.ak }); wx.getLocation({ t...

首先呢我们要实现的功能是小程序调用wx.getLocation api去拿用户的经纬度，拿到经纬度在调用百度接口解析地址现在给大家演示：bmap-wx.min.js 去官方文档下载即可http://lbsyun.baidu.com/index.php?title=wxjsapi//index.js//获取应用实例const app = getApp()const bmap...

一,下载工具：下载夜神模拟器下载地址：https://www.yeshen.com/download/fullPackage二, 配置node环境：下载地址：https://nodejs.org/en/三, 反编译工具下载：这里提供一个Github上qwerty472123大神写的node.js版本的；地址：https://github.com/qwerty472123/...

效果：wxml代码（直接给大家上代码吧，没有太复杂的逻辑）<view class="container"> <scroll-view class="content" scroll-into-view="{{toView}}" scroll-y="true" scroll-with-animation="true"> <view w...

html<view><rich-text nodes="{{html}}"></rich-text></view>jsPage({ data: { html:'' }, onLoad: function (options) { var that = this that.setData({...

html<view class="list"> <view bindtap='jumpTo' wx:for="{{keys}}" data-item="{{item}}">{{item}}</view></view><scroll-view scroll-into-view="{{toitem}}" scroll-y="t...

1.首先我们要把想保存的图片绘制在画布上<view class='container'> <canvas style='width:{{canvasWidth}}px; height:{{canvasHeight}}px' class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true">...

html<view class='container'> <!-- 签名画布 --> <canvas class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true" bindtouchstart="canvasStart" bindtouchmove="canvasMove" bin...

html<view class="swiper-container"> <swiper autoplay="auto" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" current="{{swiperCurre...

​​​​​​平时我们接触过vue的组件化开发 组件调用 组件通讯 微信小程序的跟vue意义上是相同的接下来我们开始我们创建一个公共组件：1.首先创先组件目录2.component目录中创建公共组件3.注册组件header.json文件里我们要配置{"component": true}每一个公共组件都要在component中注册{ "componen...

html<view class="container"> <view class='box' style='background:#FFFFFF'> <label>姓名:</label> <input data-value='{{inpVal}}' bindinput='getName' value='{{inpV...

路径传值<web-view src="{{url}}"></web-view>小程序page页 onLoad: function (options) { var that = this that.setData({ videoId: options.videoId, url: 'https://api...

前言这篇文章上一版本是用audio组件开发的播放器,随后反应音频加载速度慢的问题又用小程序内置的背景音乐播放的方法写了一遍,逻辑是一样的逻辑,希望对大家有所帮助！<view class='audiosBox'> <view class="audioOpen" bindtap="listenerButtonPlay" wx:if="{{!isOpe...

话不多说，直接上码，复制粘贴直接上手html<view class="radio-box" wx:for="{{radios}}" key="item.id"> <lebel class="radio {{ index==sex ? 'on' : ''}}" data-index='{{index}}' data-value='{{item.value}}...

思路很简单用background: rgba({{r}}, {{g}}, {{b}}, {{a}}) 给这四个变量0~255之间的随机整数即可html<view style="height:200px;width: 200px; background: rgba({{r}}, {{g}}, {{b}}, {{a}})"></view><view ...

首先我们先看代码//index.js//获取应用实例const app = getApp()Page({ data: { Array:[{ 'a': '10' }, { 'a': '20' }] }, onLoad: function () { var that = this var index = 0 that.setData({ ...

其实很简单的，相似度本身就很高下面开始教大家怎么转码1,首先你要下载百度小程序IDE(最新版本) 点击代码搬家2,选择你要转码的微信小程序目录3,选择你百度小程序的目录（空目录）用来保存转码后的代码4,最后一步 开始转码 即可 appid可以不填写，根据代码会有一些小小的瑕疵,需要进一步略微的二次开发，希望能帮助到大家记得关注小编噢！！！喜欢上方小...

第一步,<view class='container'> <button bindtap='startRecording'>开始录音</button> <button bindtap='pauseRecording'>暂停录音</button> <button bindtap='resumeRecording'&g...

话不多说，很简单 直接上代码吧<view class='container'> <!-- tab导航 --> <view class='switchTab'> <view wx:for='{{arr}}' class='{{currentTab == index ? "active" : ""}}' data-current...