- 博客(43)
- 收藏
- 关注
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 微信小程序开发———音乐播放器
目录一 小程序主体功能介绍二 常用组件和API介绍音频API常用组件三 整体布局数据定义主体页面运行效果四 播放器页面布局部分样式部分运行效果五 播放列表页面布局部分样式部分运行效果全部功能实现代码index.js一 小程序主体功能介绍本小程序主要实现,音乐的播放、暂停,下一曲的切换,以及播放列表和当前播放歌曲的详细信息查看等。二 常用组件和API介绍音频API介绍创建音频时需要先创建一个对象实例,从而引用该
2021-10-27 17:41:41
40261
40
原创 路由守卫(简易版)
路由守卫:路由在跳转前、后过程中的一些钩子函数,这些函数可以让你操作一些其他的事,在后台管理中设置权限时经常看到,在实现路由跳转前校验是否有权限,有权限就可以通过,反之就会被执行其他操作。
2023-04-23 15:58:06
504
原创 单页面与路由
点击左边的导航栏,右边呈现对应的内容,但页面不进行刷新,也不会重新开页面,页面路径会发生变化,页面的样式是通过引入bootstrap.css实现的。工作过程:服务器收到一个请求时,根据请求路径找到匹配的函数处理请求,返回响应数据。在基本路由的基础上,在Home组件路由中嵌套News和Message组件路由。理解:value是function ,用于处理客户端提交的请求。工作过程:当浏览器的路径改变时,对应的组件就会显示。(5)路由的嵌套(多级路由)(4)基本路由(单级路由)(3)路由的安装和使用。
2023-04-22 21:44:50
1148
原创 Vuex搭建与使用
State 本质上就是 Object 对象state的作用是:保存公共数据(多组件中共用的数据)state是响应式的: 如果修改了数据,相应的在视图上的值也会变化。它是 Vuex 中的计算属性,当 Store 数据源发生变化时,Getter 的返回值会自动更新。Mutation 本质上是JavaScript 函数,专门用来变更Store 中的数据特点:想要修改State 中的数据,只能调用Mutation 方法,它是Vuex中用来修改公共数据的唯一入口。
2023-04-09 16:32:49
717
原创 Vue中的slot插槽
但是为了让这个组件具备更强的通用性,我们不能将组件中的内容限制为固定的标签元素;例如某种情况下我们使用组件,希望组件显示的是一个视频,一张图片或按钮,插槽可以让使用者灵活的决定组件内某一块区域中放什么内容。插槽可以提供一个默认内容,如果父组件没有为这个插槽提供内容,会显示默认的内容。slot具有“占坑”的作用,在子组件占好了位置,那父组件使用该子组件标签时,新添加的DOM元素就会自动填到这个坑里面。slot没有指定name属性值的时候显示一个默认插槽,一个组件内只有一个默认插槽。(3)slot插槽的分类。
2023-04-02 11:02:01
1409
原创 Vue解决ajax跨域的问题
console.log('请求失败了',error.message)console.log('请求失败了',error.message)'/xkx': {// '/xkx'请求前缀,表示只要请求前缀是/xkx就走代理。console.log('请求失败了',error.message)console.log('请求失败了',error.message)console.log('请求成功了',respone.data)console.log('请求成功了',respone.data)
2023-04-01 18:45:41
2354
原创 Vue封装的过渡与动画
- 想要谁有动画的效果,将谁用transition标签包裹起来 appear代表刚开始就有动画-->-- 想要谁有动画的效果,将谁用transition标签包裹起来 appear代表刚开始就有动画-->isShow">显示/隐藏
2023-03-30 21:33:16
957
原创 Vue配置脚手架
(1)在安装好node.js基础上 ,配置npm淘宝镜像,可以提高下载速度。例如要在桌面创建项目先切换到桌面 cd Desktop。第一步(仅第一次执行):全局安装@vue/cli。,然后使用命令创建项目。(4)第三步:启动项目。
2023-03-26 09:09:35
281
原创 记录上一次视频播放的位置
注意:对于记录视频当前位置,因为ontimeupdate触发频次太高了,可以对其采用节流一秒触发一次,因为可以实现关闭页面下次打开从上次结束的位置开始播放视频,则应将当前时间存在本地存储里面。//打开页面触发时间,从本地存储里面取出记录的时间,赋值给video.currentTime。(2)onloadeddata事件在当前帧的数据加载完成且还没有足够的数据播放视频或音频的下一帧时触发。// 记录当前视频播放时间,存到本地存储里面,这样下次打开页面还会有,每隔一秒存储一次。主要实现功能部分的代码。
2023-03-21 10:39:06
761
原创 性能优化之防抖与节流
引入lodash.min.js,用其提供的函数为_.debounce(fun,时间)// 如果直接写函数,则页面一打开就会执行函数,且执行一次,所以要返回一个函数。(1)定义:单位事件内,频繁触发,只执行最后一次(像王者荣耀的回城操作)第一个参数为要处理的函数,第二个为过了多少秒执行函数。核心思路:利用定时器setTimeout实现。(2)使用场景:搜索输入框、手机号邮箱输入检测。(3.1)lodash处理防抖。(3.2)手写防抖函数。
2023-03-21 10:30:05
237
原创 this的指向以及更改方法
箭头函数本身没有this,箭头函数中this的引用就是最近作用域中的this(父级的this),一层一层向外层寻找,直到找到有this的定义。注意:不适用箭头函数的有:构造函数,原型函数,dom事件函数等等。谁调用指向谁,没有调用者的时候指向window。(1)普通函数的this指向,(2)箭头函数的this指向。(二)this指向的更改。(2)apply()方法。(1)call()方法。(3)bind()方法。(一)this的指向。
2023-03-20 20:31:05
419
原创 如何实现深浅拷贝
深拷贝是什么:指源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另外一个对象造成影响。(2)JS库lodash里面cloneDeep内部实现深拷贝。hobby:['跑步','唱歌'],brother:'开心豆'newObj.family.brother='开心弟'newObj.hobby[0]='跳舞'// 修改新对象中的值,不影响旧对象。name:'小开心',(2.1)先进行引入lodash.min.js。// 进行拷贝,写拷贝函数。如何进行深拷贝:(1)递归法。(3)JSON深拷贝。
2023-03-20 16:45:32
289
原创 对象的创建以及数组中常见的属性与方法
数组.reduce(function(上一次的值,这一次的值){},初始值)const cat=new Animals('小猫',3,'黑色')const dog=new Animals('小狗',2,'白色')const pig=new Animals('猪',3,'白色')Object.assign(obj,{gender:'女'})return item.name==='小米'const obj={name:'小开心',age:21}const obj={name:'小开心',age:21}
2023-03-19 15:42:04
541
原创 ES6+新语法
当代码在执行之前,会把所有在当前作用域下var声明的变量提升到当前作用于的最前面,只提升声明,不提升赋值,然后依次执行代码。可以把数组进行展开,可以利用其求数组的最大值以及合并数组的操作,剩余参数在函数内部进行使用。剩余参数允许我们将一个不定数量的参数表示为一个数组,其为真数组,例如其用...参数数组名。动态参数是伪数组,箭头函数里没有arguments,剩余参数为真数组,开发中剩余参数常用。:另外如果还有其他参数,则会先把用户输入的数给其他参数,剩余的参数给定义的数组参数。2、以数组进行开头的时候。
2023-03-16 20:39:12
788
原创 本地存储localStorage、sessionStorage
(1)数据存储在用户浏览器中(2)设置、读取方便、甚至页面刷新不会丢失数据(3)容量较大,sessionStorage和localStorage约5M左右。
2023-03-10 20:39:34
1031
原创 JS中的执行机制
3、一旦执行栈中的所有同步任务执行完毕,系统就会按次序读取任务队列中的异步任务,于是被读取的异步任务结束等待状态,进入执行栈,开始执行。(3)定时器,包括setInterval、setTimeout等。JS的异步是通过回调函数实现的,一般而言,异步任务有三种类型。(1)普通事件,如click、resize。同步任务都在主线程上执行,形成一个执行栈。(2)资源加载,如load、error。因为2为异步任务,会先执行同步任务。异步任务相关添加到任务队列中。2、异步任务放入任务队列中。1、先执行栈中的同步任务。
2023-03-10 17:08:24
175
原创 学生信息表
(7)如何给父元素追加结点 父元素.appendChild(要插入的元素)其为后插;(1)输入对应的信息,点击录入可以为下面的表格添加一条记录,注意当所填信息不完整时不允许进行提交。(3)从数组中删除数据 数组名.splice(从哪开始删,删几个)(2)当点击删除记录的时候,对应的数据会从表中进行删除。(2)点击录入,根据相关数据,生成都西昂,追加到数组中。(2)给数组增加元素 数组名.push(数据对象)(4)点击删除按钮,删除数组中的对应数据。(5)再次根据数组中的数据,渲染页面。
2023-03-10 16:20:07
2849
原创 复选框全选案例
(1)当点击或取消全选按钮时,其为点击事件(为大复选框注册点击事件),应将小复选框的checked设置 为和大复选框一致。(2)选中所有小复选框或未全选时(为小复选框注册点击事件),大复选框也跟着做相应的变化。主要是判断小复选框被选中的个数 是否和所有小复选框个数相同。(2)CSS样式部分。
2023-02-28 21:58:39
454
原创 key的作用原理与列表的遍历、追加、搜索、排序
1. 虚拟DOM中key的作用:key是虚拟DOM对象的标识,当数据发生变化时,Vue会根据【新数据】生成【新的虚拟DOM】,随后Vue进行【新虚拟DOM】与【旧虚拟DOM】的差异比较,比较规则如下:2.对比规则:(1).旧虚拟DOM中找到了与新虚拟DOM相同的key: ①.若虚拟DOM中内容没变, 直接使用之前的真实DOM! ②.若虚拟DOM中内容变了, 则生成新的真实DOM,随后替换掉页面中之前的真实DOM。(2).旧虚拟DOM中未找到与新虚拟DOM
2023-02-18 14:35:15
718
原创 python爬虫学习——requests小实战
目录1、实现百度翻译破解2、爬取豆瓣电影的详情数据3、爬取肯德基餐厅查询中指定城市的餐厅1、实现百度翻译破解根据搜索的百度翻译网页,右键->检查->Network我们可以了解到请求数据的地址:https://fanyi.baidu.com/sug、请求数据的方式:POST(请求携带参数,参数为kw:dog)、响应数据的类型:json代码实现import jsonimport requestsif __name__=='__main__': #
2022-01-08 17:37:44
492
原创 http和https协议
1、http协议1.1、概念:服务器与客户端交互的一种形式1.2、常用请求头信息User-Agent:请求载体的身份标识Connection:请求完毕后,是断开连接还是保持连接1.3、常用响应头信息Content-type:服务器响应回客户端的数据类型2、https协议2.1、概念:安全的超文本传输协议2.2、加密方式(1)对称密钥加密(2)非对称密钥加密(3)证书密钥加密...
2022-01-06 12:40:50
1316
原创 微信小程序——章节自测三
一、单项选择1、下列关于小程序生命周期说法不正确的是( )。A、分为应用生命周期和页面生命周期两种B、在onLoad 生命周期中可以获得地址中的参数C、在onLaunch中可以初始一些全局数据D、onLaunch生命周期函数会被重复执行我的答案:D...
2021-12-23 10:30:16
2431
1
原创 微信小程序——部分知识点复习
1、生命周期调用函数常见的生命周期函数有onLaunch、onLoad、onReady、onShow、onHide、onUnloadonLaunch:当小程序初始化完成时,会触发 onLaunch(全局只触发一次)onLoad:页面加载时触发,一个页面只会调用一次。通过参数options可以获取打开当前页面路径中的参数。onReady:页面初次渲染完成的时候调用。一个页面只会调用一次,代表页面已经准备妥当,此时可以与视图层进行交互。onShow:当前页面显示时触发。例如从后台切入前台。
2021-12-22 22:57:57
2727
4
原创 微信小程序——第九章章节自测
1【单选题】canvas组件是小程序中的画布组件,在同一个页面中它的哪一个属性是唯一的?A、canvas-idB、idC、classD、distable-scroll答案:A2【单选题】对于canvas组件的上下文对象ctx,下面它哪一个方法可以绘制圆形。A、moveTo()B、arc()C、lineTo()D、translate()答案:B3【单选题】下面哪一个animation对象的方法可以实现动画队列的导出?
2021-12-15 14:52:37
3104
4
原创 计算机网络——常见协议
目录一、数据链路层的协议1、点对点协议PPP2、CSMA/CD协议二、网络层的协议1、ARP地址解析协议2、ICMP网际报文控制协议3、RIP路由信息协议4、OSPF协议三、运输层的协议1、TCP传输控制协议2、UDP用户数据报协议四、应用层的协议1、域名系统DNS2、HTTP超文本传输协议3、FTP文件传送协议4、SMTP简单邮件传送协议一、数据链路层的协议1、点对点协议PPP点对点协议PPP是目前使用最广泛的数据链路层协议1
2021-12-04 00:52:10
17477
8
原创 移动开发——章节自测八
1【单选题】在微信小程序中实现从相册选择图片,或者拍照使用的API是( )。A、wx.navigateTo()B、wx.redirectTo()C、wx.chooseImage()D、wx.request()答案:C2【单选题】下列关于微信小程序页面跳转说法错误的是哪一项?A、wx.navigateTo()跳转到应用内的非标签页,且保留当前页面。B、wx.redirectTo()跳转到应用内的非标签页,且关闭当...
2021-12-01 08:36:03
1080
原创 计算机网络——IP地址与划分子网
IP地址表示对主机和路由器来说,IP地址用32位二进制代码表示,每八位分为一段,每段间用空格隔开,例如:10000000 0000101100000011 00011111为了方便记忆我们也可以用点分十进制表示,例如128.11.3.31IP地址组成32位的IP地址采用两级结构,其由两个字段组成,第一个字段为网络号,第二个字段为主机号,两个字段加起来一共有32位,假设网络号有n位,则主机号为(32-n)位。IP地址分类IP地址可分为A类,B类,C类,D类地址,前三类为单播地址,.
2021-11-11 16:52:39
7672
原创 移动开发技术——第七章章节自测
1【单选题】在微信小程序中的app.json文件中通过( )对象进行配置页面底部的标签栏。A、pagesB、windowC、tabBarD、sitemapLocation答案:C2【单选题】下面哪一项不是微信小程序中的app.json文件中tabBar对象的属性?A、colorB、listC、selectedColorD、navigationBarTitleText答案:D3【单选题】下面哪一项描述是错误的?A.
2021-11-09 20:31:05
3793
5
原创 微信小程序——video视频播放
功能介绍可以实现视频的播放暂停,发送弹幕,获取视频所处位置等。video组件1、用处video组件常用于视频的播放,默认宽度为300px,高度为225px。2、属性属性 说明 src 视频的资源地址 loop 是否循环播放,默认false controls 是否显示默认播放按钮(暂停,播放进度,时间)默认为true danmu-list 弹幕列表 danmu-btn 是否显示弹幕按钮,只在初始化有效,不能动态变更,默认为fal.
2021-11-07 16:43:09
27349
10
原创 微信小程序——婚礼邀请函页面
1、主体页面和导航栏样式app.json "pages": [ "pages/index/index" ], "requiredBackgroundModes": ["audio"], "window": { "navigationBarBackgroundColor": "#ff4c91", "navigationBarTextStyle": "white", "backgroundTextStyle": "light", "enablePull
2021-11-06 00:18:58
17599
2
原创 移动开发——音乐小程序服务器搭建
因为音频视频文件格式会比较大,开发小程序需要将这些文件放在服务器端,所以需要用node.js搭建本地服务器1.进入命令,与项目文件mymusic处建立新的文件夹mymusic-sever在路径栏中选中输入cmd进入命令控制行2. 初始化项目,输入下面命令,将会自动创建package.json配置文件npm init -y3.安装Express框架,输入下面命令,用于快速搭建HTTP服务器npm install express --save4.安装nodemon监控文.
2021-11-01 18:53:02
2539
2
原创 移动开发——计算器
计算器功能介绍:可以实现数据的加(+),减(-),乘(*),除(/),取余运算(%),以及实现数据的删除(Del)和清空功能(C)。计算器页面设计数据部分data:{ // data中只放置初始数据 num:"1", op:" "//记录运算符号 }index.wxml页面<view class="result"> <view class="result-num">{{num}}</view> <view
2021-10-31 16:35:58
2502
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人