- 博客(99)
- 资源 (12)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 云音乐小程序管理系统（六）——HPPT API调用云存储下载文件展示轮播图
因为要从云储存调用图片，对轮播图进行设置所以前期工作要做足，首先在云控制台的云存储中新建一个文件banner来存放图片新建数据库banner来存放图片信息获取数据信息，下载文件展示轮播图在前端中获取显示列表信息的方法，在生命周期函数中响应在前端请求数据// 获取轮播图列表信息export function fetchList() { // 发送请求 return reques...
2020-03-29 23:09:36
616
原创 云音乐小程序管理系统（五）——HTTP API调用云数据库实现歌单更新
更新查询每一条的数据在歌单列表可以获取后，面领着新的问题，如何实现歌单的更新，即编辑功能首先要让编辑有意义，那么肯定就得现有一个编辑的点击事件。<template slot-scope="scope"> <el-button size="mini" @click="onEdit(scope.row)">编辑</el-button>V...
2020-03-29 10:18:57
849
原创 云音乐小程序管理系统（四）——歌单列表前后端交互与跨域问题
让我们的后端获取到的歌单信息，在我们前端VUE框架上显示出来。所以我们前端要发送一个请求src-api-新建文件playlist.js使用request中封装的import axios from 'axios'来发送请求获取地址，进行数据请求。在我们的文件中引用请求文件import { fetchList } from '@/api/playlist'并且通过他获取歌单列表的信息...
2020-03-27 23:29:05
873
原创 云音乐小程序管理系统（三）—— HTTP API触发云函数获取歌单列表
安装一下koa的路由npm install koa-router使用MVC的思想，将前端操作文件都存放在controller中，将前端请求和调用都存放在其中一、请求路由在我们的入口文件app.js中导入路由信息和歌单请求文件//导入文件const playlist=require('./controller/playlist.js')//声明路由router.use('/playli...
2020-03-26 21:29:30
545
原创 云音乐小程序管理系统（二）—— 接口调用凭证access_token的缓存与更新
一、access_token调用小程序的access_token是在官方文档下的服务端——接口调用凭证接下来就是获取我们的access_token
2020-03-25 23:27:33
355
原创 云音乐小程序管理系统（一）——配置与设置
使用了github中的一个VUE的开源模板。在github中输入vue-element-admin选择下载人数最多的一个进去。找到他的克隆地址，复制在开发工具终端进行下载（电脑需要正确安装了git才可以）这样就把整个模板项目下载到了我们本地，之后利用提供的指令进入程序中这就是github提供的指令，相信用过的应该都是知道怎么操作的。...
2020-03-25 16:30:38
659
原创 小程序性能与体验优化
性能优化的点合理设置可点击元素的响应区域大小避免渲染页面耗时过长避免执行脚本耗时过长对网络请求做必要的缓存以避免多余的请求不要引用未被使用的wxss样式文字颜色与背景搭配较好，适宜的颜色对比度更方便用户阅读所有资源请求建议使用HTTPS不适用废弃接口避免过大的wxml节点数目：（1）一个页面少于1000个wxml节点（2）节点树深度少于30层（3）子节点树不大于60避免将不可...
2020-03-22 23:51:03
1000
原创 小程序的启动机制和更新机制
启动机制启动冷启动：（1）第一次打开该应用程序（2）被微信官方销毁过，用户再次打开热启动：打开过小程序，并在一定时间内再次打开前后台前台后台点住右上角的按钮，关闭的是前台，程序会由前台状态转化为后台状态小程序的销毁（1）小程序进入后台后，在运行一段时间，会被微信主动销毁（2）小程序对系统资源高占用，被系统销毁或者回收更新机制可以设置程序检测版本信息，使用组件wx.g...
2020-03-22 23:11:50
338
原创 小程序渲染层与逻辑层交互原理
渲染层：用于我们在界面上进行显示的。逻辑层：用来处理逻辑问题的。在网页开发中两者是互斥的，但是在小程序开发中却是分开的。而在运行的环境上，逻辑层和渲染层也是有一些区别的渲染页面的技术选择纯客户端原生技术纯WEB技术用客户端原生技术与Web技术结合的混合技术（Hybrid）而小程序选择的是第三种方式。下图就是小程序的渲染与逻辑交互机制，我们在渲染层的请求并不会直接到了逻辑层...
2020-03-22 17:57:27
2368
原创 云调用生成小程序码
详细的信息内容是可以看官方文档的https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.get.html实现：使用云调用的方法实现，不使用HTTP形式。所以我们肯定需要首先先建立一个云函数getTwoCode给云函数配置权限在.json文件中 "permission...
2020-03-22 16:48:56
3271
原创 对比不同方式获取用户信息的应用场景
1、只想在当前页面显示用户昵称和头像（且无需授权）小程序自带的组件化能力<open-data></open-data>使用“type”属性来获取不同的用户信息userAvatarUrl 用户头像userNickName 用户昵称userCountry 用户国家userCity 用户城市2、在JS中获取信息，并且进行DB存储...
2020-03-20 22:56:02
359
原创 Axure rp9的使用——动态面板
一、动态面板1、面板折叠我们是需要在做好动态页面后，有两个面板页面，即一个展开一个折叠。这就是前期我们准备折叠的部分，接下来返回，对面板添加交互——页面点击时——设置面板状态，设置动作如下就可以。这样就可以查看到页面的折叠效果，但是这里有一个需要注意的地方，我们需要将向下滑动的时间尽可能的短，否则下滑效果会很难受，很清晰的看到每一个动画滑过的状态。2、标签导航实现效果就是一般...
2020-02-23 16:26:59
30961
3
原创 小程序的分享功能
先将我们的分享图标用button圈起来。分享功能需要开启小程序的开放能力open-type="share"而我们想要分享或者传递过去的东西，包括了很多，比如我们的当前的内容，最终的识别ID等所以将我们列表信息传递到分享的菜单组件中，让他获取到列表信息这样就可以在自带的分享事件中获取到这些内容了获得这样的效果图。之后进行分享的编写基本上就大工告成了。...
2020-02-21 22:04:13
1090
原创 评论功能与订阅消息推送的实现
一、评论主要我们第一需要做的，就是将我们的评论内容合适的推送进入云数据库当中和之前类似，我们需要专门的一个评论的集合来存放内容。主要是存放用户评论内容、昵称、头像、时间的内容首先先要获取到用户输入的内容通过我们微信自带的函数来获取用户输入信息 onInput(event){ this.setData({ content:event.detail.val...
2020-02-21 15:26:20
965
原创 云数据库模糊查询与索引管理
针对使用云数据库模糊查询的是搜索功能，如何使搜索框获取到用户输入的内容在搜索框中绑定对应事件bindinput来获取用户输入内容onInput(event){ keyword=event.data.value },在我们的搜索中有一个事件来执行搜索操作catch:tap="onSearch"我们将搜索方法放在调用方，可以使组件的复用性更好，这样就可以不只是用在一个组织...
2020-02-19 18:05:25
1038
原创 多文件上传云数据库
微信的云数据库为非关系型JSON格式数据库。所以处理上和关系型数据库还是有一些区别的。EG：我的博客信息我们需要上传的数据上传的是云数据库。主要包括内容和图片。图片是上传到云存储之中的。再上传成功后，云储存也会返回一个对应的fileID。所以在数据库中存放的内容主要是：内容、图片fileID、用户标识openID、用户昵称、头像、发布时间一、图片上传...
2020-02-17 23:04:41
366
原创 类博客页面获取输入字数&&键盘拉起底层上提&&&选择图片的实现
一、获取输入字数在我们的输入组件中使用bindinput="事件名"的方法可以获取到我们向输入框中输入的信息的值设置最大输入个数在我们的bindinput事件中已经获取到输入的个数，所以我们可以让他与最大输入值进行比较，这样就可以限定输入最大的长度了。 //获取用户输入信息 onInput(event){ var wordsNum=event.detail.cursor//...
2020-02-16 23:29:43
96
原创 slot插槽与授权组件
在组件中，有时候承载信息过多而无法灵活使用，这个时候就需要一个slot插槽来让组件可以承载来自页面WXML的内容<solt></solt>组件中添加了插槽后就可以直接使用，但是如果是同时使用了多个插槽，那么单纯插入多个插槽是不管用的，需要开启多个插槽功能在区分上使用具名的方法。对每个插槽使用name=“***”，然后在前端使用时进行具名引用slot="***"即可。...
2020-02-16 17:35:55
201
原创 组件化开发的传值问题
在小程序中进行组件化开发，主要就是有两个问题，一个是通过组件给我们的前台传值，或者是前端事件对组件进行传值。介绍的是现在自己常用的，其他的暂时还没怎么使用。组件对前端进行传值在组件中使用 triggerEvent 方法抛出，指定事件名、detail对象和事件选项。实现组件间的通信例如这样，抛出了一个事件名，一个值。this.triggerEvent('timeUpdate',{ ...
2020-02-14 22:07:57
284
原创 歌词组件的设计与实现
首先需要实现的就是，在点击封面的时候，可以显示歌词页面，即在封面的时候会有一个点击事件点击事件控制元素是否显示定义组件过程、引用（略）在封面上定义点击事件bindtap="onChangeLyricShow"在脚本中我们定义一个全局bool变量，判断当前是歌词还是封面。在事件中进行取反数据绑定 onChangeLyricShow(){ this.setData({ ...
2020-02-14 21:20:31
482
原创 音乐进度条组件progress-bar的设计与实现
新建组件文件（略）引用组件（略）组件界面设计在组件内定义显示内容开始播放时间、总时间、滑动模块时间部分使用数据从脚本中定义引用滑动模块效果方式（1）官方自带滑动组件（2）自定义滑动元素使用内置的滑动区域组件，构造一个可以移动的区域属性的说明在截图注释上。这样在加上样式就可以构成一个显示的进度条样式了样式代码请参考在github上的文件。...
2020-02-12 15:13:12
1826
原创 音乐播放界面控制面板功能的实现（旋转动画、代码、思路）
在之前的准备工作中，界面已经是准备好的，第一部分现在要实现控制面板的功能实现，让他可以通过控制面板的按钮图标来实现歌曲的播放暂停上下曲。所以我们需要获取当前播放音乐的URL地址通过之前我们已经获取到数据的URL，我们从云端调用数据。event.musicId为我们传递过来的歌曲ID，之后返回获取到的数据。在前端显示页面的脚本中，调用云函数，传递ID（musicId），打印出来来看一看...
2020-02-10 21:57:50
1566
原创 引入使用iconfont字体
这个时候就先安利一个矢量图网站，也是这次需要用到的网站iconfont正常下载，我们可以找到绝大部分我们能用到的图标图片，但是iconfont字体并不是这样常用方式开始的方法：第一 将我们要用到的图标点击购物车第二 打开购物车将图标添加到项目第三 在项目中选择Font class 查看在线代码 提示暂无就点击生成第四 生成代码为.css文件,微信只支持.wxss文件，所以复制...
2020-02-08 23:42:39
450
原创 播放器界面的构建与根据之前内容获取歌曲信息的思路
思路：获取歌曲信息的两种方式第一种是通过API接口和获取到的歌曲ID，去对应的从网上远程拉取歌曲信息第二种是从当前已经循环遍历出来的信息中直接获取歌曲信息，将信息保存在本地，避免多次拉取数据造成用户等待信息过长。实施：第一步在歌曲列表中，获取信息后即获取到了歌单信息的值，现在在取到值后同步让他存在于本地存储中（清楚缓存使用编译器的清缓存功能）定义函数，使用wx.setStorageSy...
2020-02-08 22:54:51
230
原创 云开发的两种常用数据遍历获取信息的方式
在云开发中，数据遍历常用有两种方式，第一种方式在js脚本中，将数据作为一个集合传进来。在data中定义集合playList: [],从云函数中调用云数据库读取数据，将数据传给集合进行数据绑定将数据绑定在集合后，在前台通过wx:for循环遍历来取到我们获取到的集合内的内容第二种方式第二种方式，我们是在组件中进行遍历，在前台只做数据接收。现在脚本中定义一个集合接收数据musiclis...
2020-02-07 23:10:50
1374
原创 云函数路由优化的使用
优化原因：1）用户在云环境中可以创建的云函数是有数的2）相似的请求归类到同一云函数处理3）tcb-router是一个koa风格的云函数路由库tcb-router的作用：云函数轻量级类路由库，主要用于优化服务器端函数处理逻辑。github中的地址https://github.com/TencentCloudBase/tcb-router对应云函数安装npm install --save ...
2020-02-06 22:09:27
352
原创 读取云函数获取数据并刷新加载
一、读取云函数新建一个云函数获取数据库中的信息，将它分类排序(orderBy)设置开始（start）结束（count）在前端进行引用wx.cloud.callFunction在首次加载onLoading中引用云函数，设置开始加载和结束加载的内容并返回数据到前端数组playlist中。数据绑定后边的内容为它在数据库中的位置。二、刷新加载在小程序中，提供了刷新与加载的函数。在.js中...
2020-02-05 23:45:56
1193
原创 使用云函数，将数据插入云数据库的各种设置与功能的实现
一、云函数在小程序云开发中，编译器的cloudfunctions代表云函数部分。1、创建云函数右键——新建Node.js云函数2、发送数据云函数上传递数据是需要借助第三方库进行传递。本次使用request库的内容进行传递数据。（1）、安装request（前置已安装node.js）查询node和npm是否安装node -vnpm -v打开github，搜索request/req...
2020-02-05 22:46:12
4070
4
原创 消除WXMLRT_$gwx:./yList.wxml:block:10:3: Now you can provide attr `wx:key` for a `wx:for` to improve警告
这个警告的意思是我们在使用wx:for时，也应写上wx:key以提高程序性能。所以们用key来修正我们前边的字符，或者是在基础上做一个更改修订。所以我们根据每一个应用场景的不同，来做不同的wx:key的内容。但是要注意，需要我们key中的内容和我们使用的数据名之类的内容是一一对应的。*this 指向元素本身...
2020-02-02 22:42:48
2834
原创 组件化设计——定义一个歌单组件
在小程序中提供了它组件化思路，将重构性多的模块进行组件化，可以节约我们的很多时间，也可以使用时更加方便快捷。在目录上，右击选择新建component即新建了一个组件的部分。1、引用组件的引用是在.json中出现。1、usingComponents的意思就是我们正在使用的组件。名字是随意自己自定义的+路径即可。2、在wxml中引用的话，就是直接引用定义的名字即可。2、使用在我们使...
2020-02-01 23:09:54
351
原创 小程序学习（8）——电影更多页的设计与制作
一、更多页面的制作1、区分获取不同类目有了上一个主页面的基础，肯定我们是知道了我们需要什么东西，在这个时候我们最需要的东西是一个跳转的点击事件catchTap和相关API的调用，来做页面显示。在我们listTamplate中对更多添加了点击事件之后，我们会发现模板文件好像并没有一个地方让我们书写点击事件。我是放在了movies.js下边，即首页面下，其实有兴趣可以尝试一下是不是哪个页面也可以...
2020-01-31 16:47:09
1018
原创 git提示error: Merging is not possible because you have unmerged files. hint: Fix them up in the work
在提交git时提示了一堆错误，大体是文件冲突，无法提交到远程库。在尝试查看冲突内容git diff后，看到了冲突信息。接下来进行了修改，但是发现作用并不是很大，开始提示error: Merging is not possible because you have unmerged files.hint: Fix them up in the work tree, and then use ...
2020-01-28 23:55:34
9668
原创 小程序学习（7）——电影页面设计制作及豆瓣API403解决
在之前学习做完了新闻文章的内容，这次开始学习电影的内容，而在电影的内容中，template模板是一个很重要的工具，所以让我们尽情的使用这个工具来嵌套吧。...
2020-01-28 21:20:15
2242
原创 小程序嵌套template或者其他路径问题的思路
在使用template模板组件的时候，遇到了嵌套多层，但是最终在显示页无法显示的问题，刚开始一直觉得可能是我单词写的有问题（Ps:小程序环境不报错），在多次检查无果的情况下我将目光对准了路径。其实在小程序调试器也有报错，但是并没有VScode或者text3之类的那么好用，他的非主要性错误都使用的是黄色字体。我的路径在出现错误后，报了在根目录路径下找不到，这个时候，前后比对了一下他报错的两个路径...
2020-01-26 23:40:37
285
原创 小程序学习（6）——在现有基础上做音乐组件
在之前的基础上已经将前边的界面搭配的基本上是可以看了，这个时候做我们的音乐播放功能。大体功能其实和收藏功能类似。前边已经完成了一下内容我们要做的就是在这个上边可以播放音乐，即一点击音乐按钮即播放音乐。首先在前端“.wxml”中的音乐图标上写上一个点击事件。来响应我们点击时的变化。catchtap="onMusictap"在脚本文件中开始对点击事件的描述1、因为每篇文章的音乐肯定是不一样...
2020-01-13 22:53:58
164
原创 微信小程序报错VM697:1 Failed to load other http://127.0.0.1:12818/aboutblank?42 net::ERR_CACHE_MISS
在小程序之前一切正常，并且运行无问题的情况下。莫名其妙开始报错net::ERR_CACHE_MISS，并且显示端口有问题。首先第一个想到的就是是否勾选的忽略合法效验没有了，就去详情——本地设置查看，发现是没有问题的...
2019-12-26 14:01:25
2650
原创 小程序学习（4）——News详情页传数据与页面跳转（一般黑字是重点）
前边已经设计好新闻的列表页之后，也需要开始做详情页，否则打开只有一个列表页其他功能也打不开实在是有点太假了。所以开始学习做新闻详情页。一、跳转不过做怎么样，肯定首先都得可以跳转页面才行，否则还是在当前页面那岂不是很尴尬的。第一步：先新建一个页面，作为详情页面。千万记得在app.json中添加该页面第二步：书写响应时间，因为使用了template模板，所以在我的“index.wxml”中，...
2019-12-23 17:39:03
403
原创 小程序学习（3）——template模板的使用
在其他程序语言中，也有模板化技术的使用，使得代码的复用率更高，减少代码工作量减轻服务器运行压力。也许在代码量少的时候还并不是很明显，但是在代码量增加或者应用越来越大的时候它的作用就会很凸显出来。在小程序中，通过template将一部分代码设置成模板，可以在目录下新建两个模板文件，一个“wxss”样式文件，一个“wxml”代码文件存放代码。原代码处在原代码处，需要引用的地方使用<bloc...
2019-12-19 00:04:46
310
原创 小程序学习（2）——数据绑定与跳转界面
再上一个学习中，进行了小程序首秀，那么接下来就是在深入的自己学习的一些内容。主要是设计一个新闻列表页面，也算是在代码初学中都比较经典的一些学习过程了。后边我会放写好的在github的代码链接一、页面思路与构思大体如图，我们需要先想一下，这个界面由哪几部分构成，首先最大的肯定是两方面，一部分是轮播图，一部分是下边的新闻列表。轮播图没什么可说的，就是图片轮换，另外一部分细分我把他分为了四部分...
2019-12-04 00:58:47
280
备忘录（SQList）
2017-07-02
jQuery EasyUI 1.5 版 API 中文版
2017-06-30
office办公图表怎么画
2017-09-13
TA创建的收藏夹 TA关注的收藏夹
TA关注的人