微信小程序
微信小程序
草字
点点关注点点赞,私信问答先回复。
展开
-
jssdk 公众号使用wx.getLocation的坑,无法进入success
如下代码,在调用获取地址的成功后,进入了success回调函数,只执行了第一个console.log打印“地理位置:”,然后就结束执行了。主要原因是不能再里面调用外部的函数,微信官方也不报错提示开发者,直接就终止继续执行了,这就导致开发者很蒙蔽:wx.ready(function () { wx.getLocation({ type: 'gcj02', success(res) { console.log("地理位置:");原创 2021-05-12 11:03:43 · 3420 阅读 · 0 评论 -
微信开发者工具 设置一个tab为4个空格
1.设置编辑器的tab大小为4个空格2.如果不生效,点击调试器右下方的空格,然后选择4,最后在单个文件夹格式化文档就可以生效了。原创 2021-03-31 14:32:25 · 2743 阅读 · 0 评论 -
html5 微信公众号网页调试,如何在微信浏览器打开调试
一、步骤一,打开微信开发者工具。二、步骤二,在如下图输入框中输入链接即可。原创 2021-03-10 09:41:13 · 2185 阅读 · 0 评论 -
微信小程序 音乐播放代码(播放方式,歌词滚动) (更新优化版:添加文字颜色过渡)
效果图:wxml:<view class="container flex-align"> <view style="text-align:center;position:relative;" class="box"> <view style="color:white;">{{songs.name}}</view> <view style="color:#ddd;" class="f12">{{songs.ar[0].name}}&l原创 2020-08-21 12:16:37 · 6615 阅读 · 7 评论 -
css 音乐文字颜色的过渡效果(从左到右)
效果图:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .container原创 2020-08-21 12:16:44 · 815 阅读 · 0 评论 -
微信小程序 音乐播放代码(播放方式,歌词滚动)
部分资源:dayjs:https://download.csdn.net/download/qq_42740797/12728688animate:https://download.csdn.net/download/qq_42740797/12728700wxml:<view class="container flex-align"> <view style="text-align:center;position:relative;" class="box">原创 2020-08-19 16:48:22 · 8424 阅读 · 12 评论 -
微信小程序 定时器使用(创建与销毁)
以下为局部代码:1.全局的变量:let timeId='';//定时器2.创建定时器onLoad或onShow: onShow: function () { timeId=setInterval(()=>{ console.log("进行");//这里写逻辑代码 },1000); },3.销毁定时器onUnload: onUnload: function () { //销毁定时器 clearInterval(timeId); },原创 2020-08-18 14:25:18 · 1750 阅读 · 0 评论 -
微信小程序 剪贴板复制功能。(文件大于10M不能下载如何解决)
//下载音乐 download(e){ console.log(e); wx.setClipboardData({ data: "http://m7.music.126.net/20200818140834/1bcc2c20077ea0354729edb7dcce4b9d/ymusic/obj/w5zDlMODwrDDiGjCn8Ky/2672227524/eb23/94c6/b7d8/c35e5291f93ff5901a8b9dd354668e3a.mp3",原创 2020-08-18 13:48:40 · 1647 阅读 · 0 评论 -
css 暂停动画
一、给动画添加样式:.animate{ -webkit-animation: rotate 10s linear infinite;//动画类 animation-play-state:paused; -webkit-animation-play-state:paused; /* Safari 和 Chrome */}原理:只要给动画样式添加如上的后两行代码,动画就不会继续执行了。二、动态绑定:.animate{ -webkit-animation: rotate 10s lin原创 2020-08-17 16:06:09 · 986 阅读 · 0 评论 -
css、微信小程序 模糊背景图片(音乐播放界面)优化版
<!--背景图片--><view class="bgImage"><image src="{{songs.al.picUrl}}"/></view>.bgImage{ filter:blur(50px); position:absolute; height:100%; width:100%; z-index: -1;}.bgImage>image{ height:100%; width:100%;}...原创 2020-08-14 13:11:57 · 706 阅读 · 0 评论 -
设置模糊背景图片(微信小程序代码)
<!--背景图片--><view class="bgImage" style="background:url({{songs.al.picUrl}})"></view>.bgImage{ background-repeat:no-repeat; background-size:cover; -webkit-filter:blur(15px); -moz-filter:blur(15px); -o-filter:blur(15px); -ms-原创 2020-08-14 11:02:03 · 880 阅读 · 0 评论 -
微信小程序 设置模糊背景图片
<!--背景图片--><view class="bgImage"><image src="{{songs.al.picUrl}}"/></view>.bgImage{ position: absolute; height:100%; width:100%; z-index: -1; opacity: 0.5; overflow: hidden;}.bgImage>image{ height:200%; width原创 2020-08-14 10:51:24 · 4143 阅读 · 0 评论 -
微信小程序 后台播放,多页面播放
在app.json中添加如下代码"requiredBackgroundModes": ["audio", "location"]原创 2020-08-14 10:38:18 · 843 阅读 · 0 评论 -
微信小程序 冒泡事件和非冒泡事件
WXML的冒泡事件列表:语法:最前面加bind关键词。事件说明touchstart手指触摸动作开始touchmove手指触摸后移动touchcancel手指触摸动作被打断,如来电提醒,弹窗touchend手指触摸动作结束tap手指触摸后马上离开longpress手指触摸后,超过350ms再离开,如果指定了事件回调函数并触发了这个事件,tap事件将不被触发longtap手指触摸后,超过350ms再离开(推荐使用longpress事件代替原创 2020-08-12 10:25:49 · 695 阅读 · 0 评论 -
微信小程序 onLoad和onShow的区别,解决从二级页面跳回去不重新加载(刷新)
从第二级页面返回该页面时,onLoad不会再次加载,而onshow会重新加载。原创 2020-08-11 15:47:06 · 2434 阅读 · 0 评论 -
微信小程序 复习笔记
项目结构pages文件夹: 路由组件新建components文件夹: 一般组件app.js: 入口js文件 把里面的代码全删了 然后生成一个App的模板代码即可app.wxss: 全局的css文件, 全局的css只在路由组件里面生效 一般组件是用不了的app.json: 全局的配置文件pages: 配置路由 写的是绝对路径 那个路径写在第一个 谁就是首页window: 全局导航栏配置navigationBarBackgroundColor: 导航栏背景颜色navigationBar原创 2020-08-11 10:08:23 · 294 阅读 · 0 评论 -
微信小程序 使用animate动画教程
1.下载文件。路径:https://download.csdn.net/download/qq_42740797/12703601官网路径:https://animate.style/2.在项目根目录新建一个“style”文件夹存放下载样式文件。3.全局导入样式,在“app.wxss”文件最开始引入。4.使用。注意:动画类要去掉“animate__”.每个动画都有的五个参数:animation: 动画名 持续时长 速度曲线 开始时延迟的时长 播放次数 轮流反向播放第一种:直接给全原创 2020-08-11 09:40:34 · 5114 阅读 · 0 评论 -
微信小程序 以回车或换行符拆分文章内容split
font.split(/\r\n/g);原创 2020-08-10 10:27:22 · 1864 阅读 · 0 评论 -
微信小程序 网络请求的加载中和隐藏加载中模板,提升用户体验。
1.开始网络请求时显示loading加载中提示框:wx.showLoading({title: ‘加载中’,});2.得到网络请求的数据时隐藏loading加载中提示框:wx.hideLoading();示例: wx.showLoading({ title: '加载中', }) api.getCatsBooks(gender,type,major,minor,start,this.data.limit).then(res=>{ console.log(原创 2020-08-07 16:52:37 · 944 阅读 · 0 评论 -
微信小程序 保存图片,网络图片问题(网络图片地址)
保存网络图片必须使用wx.downloadfile下载到缓存,然后才可以通过wx.saveImageToPhotosAlbum保存图片。//先下载 wx.downloadFile({ url: str, success (res) { if (res.statusCode === 200) { wx.saveImageToPhotosAlbum({ filePath:原创 2020-08-07 16:48:40 · 720 阅读 · 0 评论 -
微信小程序 设置文本溢出加省略号不生效,文本超出3行加省略号
css添加以下代码,并应用其样式。.text-deal{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all; /* 追加这一行代码 */}-webkit-line-clamp为3,代表三行后超出隐藏加省略,常用为1。...原创 2020-08-05 17:06:28 · 4067 阅读 · 1 评论 -
微信小程序 动态绑定样式
使用三目运算符,左边的表达式成立,执行一个样式,否则另一个样式。<view> <view class="{{active===0?'a':''}}">分类</view> <view class="{{active===1?'a':''}}">排行</view></view>原创 2020-08-05 13:54:05 · 3339 阅读 · 0 评论 -
微信小程序 教程或复习
项目结构pages文件夹: 路由组件新建components文件夹: 一般组件app.js: 入口js文件 把里面的代码全删了 然后生成一个App的模板代码即可app.wxss: 全局的css文件, 全局的css只在路由组件里面生效 一般组件是用不了的app.json: 全局的配置文件pages: 配置路由 写的是绝对路径 那个路径写在第一个 谁就是首页window: 全局导航栏配置navigationBarBackgroundColor: 导航栏背景颜色navigationBar原创 2020-08-05 10:35:05 · 218 阅读 · 0 评论 -
微信小程序 vant的安装和使用教程,npm安装
1.在项目的根目录打开终端(命令行),输入以下命令:npm init //初始化,生成package.json文件npm install --productionnpm i vant-weapp -S --production //安装vant2.构建npm:首先必须确保上图的“使用npm模块”被勾上的。然后点击菜单栏“工具”下的“构建 npm”,并生成了“node_modules”文件夹。3.需要使用组件的地方在相同目录下的.json文件中导入组件,以下为例子,路径必须对。"us原创 2020-08-04 15:48:23 · 840 阅读 · 5 评论 -
微信小程序 报错:“不在以下 request 合法域名列表中”
微信小程序 报错:“不在以下 request 合法域名列表中”。解决方法:在工具栏的“详情”的“本地设置”下勾上:小程序默认不会勾选最后一个不校验合法域名的选框,所以这里需要我们手动勾选不校验合法域名选框...原创 2020-07-15 14:01:30 · 2683 阅读 · 1 评论