- 博客(22)
- 收藏
- 关注
RSS订阅
原创 普歌-飞灵团队【javaScript】移动端轮播图
移动端轮播图移动端轮播图功能和基本PC端一致1.可以自动播放图片2.手指可以拖动播放轮播图引入基本样式 <link rel="stylesheet" href="css/normalize.css" /> <link rel="stylesheet" href="css/index.css" /> <script src="js/index.js"></script>焦点图模块 HTML代码：<!-- 焦点图 -->
2020-10-18 11:32:14
204
原创 普歌-Vue 封装防刷新考试倒计时组
date.vue<!-- 定时器组件 --><template> <div class=""> <p>{{ count }}</p> </div></template><script>export default { components: {}, props: { // 父组件传过来的秒数 seconds: { type: Number,
2022-05-19 21:45:44
364
原创 普歌-组件通信
组件通信的方式如下：props / $emit父组件通过props向子组件传递数据，子组件通过$emit和父组件通信1. 父组件向子组件传值● props只能是父组件向子组件进行传值，props使得父子组件之间形成了一个单向下行绑定。子组件的数据会随着父组件不断更新。● props 可以显示定义一个或一个以上的数据，对于接收的数据，可以是各种数据类型，同样也可以传递一个函数。● props属性名规则：若在props中使用驼峰形式，模板中需要使用短横线的形式// 父组件<t
2022-04-27 18:10:41
106
原创 普歌-自定义promise
Promise概念new Promise(function () { })当传递给 new Promise 的函数被称为 executor, new Promise 被创建，executor 会被自动运行。它会提供两个参数 resolve、reject。当 executor 获取到了结果，无论是什么时候获取到了，它都应该执行这两个回调函数。resolve 成功的回调reject 失败的回调new Promise 构造器返回的 promise 对象具有以下的内部属性。状态
2022-04-26 19:34:07
185
原创 普歌-Promise用法
Promise概述Promise是异步编程的一种解决方案，从语法上来讲，Promise是一个对象，从而它可以获取异步操作的消息使用Promise主要有以下好处：可以避免多层异步调用嵌套问题（回调地狱）Promise对象提供了简洁的API，使得控制异步操作更加容易Promise基本用法实例化Promise对象，构造函数中传递函数，该函数中用于处理异步任务resolve和reject两个参数用于处理成功和失败两种情况，并通过Promise.then获取处理结果var p = new Pr
2022-04-25 14:45:38
117
原创 普歌-事件循环-发布npm-Stream
Node的架构分析浏览器中的EventLoop是根据HTML5定义的规范实现的，不同的浏览器可能会有不同的实现，而Node中是由libuv实现的来看一下Node架构图：我们会发现libuv中主要维护了一个EventLoop和worker threads（线程池）EventLoop负责调用系统的一些其他操作：文件的IO、Network、child-processes等libuv是一个多平台的专注于异步IO的库，它最初是为了Node开发的，但是现在也被使用到Luvit、Julia、pyuv
2022-04-24 21:59:50
1260
原创 普歌-事件循环
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录事件循环和异步IO一、事件循环是什么？二、进程和线程1.多进程多线程开发2.浏览器和JavaScript三、JavaScript执行过程四、浏览器的事件循环五、宏任务和微任务事件循环和异步IO一、事件循环是什么？我们可以把事件循环理解成我们编写的JavaScript和浏览器或者Node之间的一个桥梁。浏览器的事件循环是一个我们编写的JavaScript代码和浏览器API调用（setTimeout/Ajax/监听事件.
2022-04-23 13:55:47
1347
原创 普歌-nuxt.js基础
Nuxt.js一、Nuxt.js简介需求分析了解搜索引擎优化SEO服务器渲染和客户端渲染（SSR）什么是客户端渲染客户端渲染特点：什么是服务端渲染（SSR）服务端渲染特点：为什么使用服务器端渲染（SSR）二、Vue.js如何实现SSRNuxt.js工作原理三、搭建Nuxt环境和创建项目开发环境安装脚手架工具和创建项目NPM方式NPX方式一、Nuxt.js简介官网：https://zh.nuxtjs.org需求分析采用vue.js开发的应用系统SEO不友好，需要解决SEO的问题比如：新闻门户 .
2021-05-15 16:03:37
350
原创 普歌-vue项目优化
1.项目优化策略生成打包报告第三方库启用CDNElement-UI组件按需加载路由懒加载首页内容定制1.生成打包报告打包时，为了直观地发现项目中存在的问题，可以在打包时生成报告。生成报告的方式有两种：① 通过命令行参数的形式生成报告// 通过 vue-cli 的命令选项可以生成打包报告// --report 选项可以生成 report.html 以帮助分析包内容vue-cli-service build --report② 通过可视化的UI面板直接查看报告（推荐）在可
2021-05-05 17:04:31
88
原创 普歌-uniapp中request请求封装和使用（promise）
uniapp中request请求封装和使用(promise)开发时我们使用本地的请求地址，而在项目上线时会使用线上的地址，并且每个请求所含的参数和请求方式都不大相同，那么在开发时对请求进行封装就是必要的如图，先新建文件夹api，然后创建js文件1.请求接口地址request.js// 公用地址let url = '域名/api/'// 配置接口文档路径let getpreferurl = `${url}forshop/getprefer`export{getpreferurl}2.错
2021-05-05 10:00:17
422
1
原创 普歌-axios基本使用
axios一、接口文档二、axios的基本使用//使用默认方式发送无参请求<script src="https://unpkg.com/axios/dist/axios.min.js"></script><script> axios({ url: "http://localhost:9999/student/student/getAllStudent", }).then((res) => { console.log(res);
2020-12-23 18:08:05
110
原创 普歌-基于后台接口重构图书管理案例
Vue基础——基于接口的图书管理案例案例分析图书相关的操作基于后台接口数据进行操作需要调用接口的功能点① 图书列表数据加载 GET② 添加图书 POST③ 验证图书名称是否存在 GET④ 编辑图书-根据id查询图书信息 GET⑤ 编辑图书-提交图书信息 PUT⑥ 删除图书 DELETE需要准备的步骤# 图书管理后台接口文档> 基准路径： http://localhost:3000/## 获取图书列表数据- 路径：books- 请求参数：无- 响应结果```j
2020-12-23 13:27:21
133
原创 普歌-【案例】用户信息增删改查
案例：用户信息增删改查案例分析–>//搭建网站服务器,实现客户端与服务器端的通信//连接数据库,创建用户集合,向集合中插入文档//当用户访问/list时,将所有用户信息查询出来// 实现路由功能// 呈现用户列表页面//从数据库中查询用户信息 将用户信息展示在列表中//将用户信息和表格HTML进行拼接并将拼接结果响应回客户端//当用户访问/list时，将所有用户信息查询出来//当用户访问/add时,呈现表单页面,并实现添加用户信息功能//当用户访问/modify时,呈现修改
2020-11-28 16:14:52
157
原创 普歌-Node.js异步编程(异步API)
Node.js中的异步APIfs.readFile("./demo.txt", (err, result) => {});var server = http.createServer();server.on("request", (req, res) => {});如果异步API后面的代码执行依赖当前异步API的执行结果，但实际上后续代码在执行的时候异步API还没有返回结果，这个问题要怎么解决呢?fs.readFile('./demo.txt',(err,result) =&g
2020-11-22 11:20:43
113
原创 普歌-Node.js异步编程(区别与分析)
同步API,异步API//路径拼接const public = path.join(__dirname,'public');//请求地址解析const urlObj = url.parse(req.url);//读取文件fs.readFile('./demo.txt','utf8',(err,result) => { console.log(result);});1.同步API：只有当前API执行完成后，才会继续执行下一个APIconsole.log("before")
2020-11-22 10:47:48
181
原创 普歌 - 【js高级】- 用户名、表单验证
用户名验证分析1.用户名只能为英文字母,数字,下划线或者短横线组成,并且用户名长度为6~16位2.首先准备好这种正则表达式模式/$[a-zA-Z0-9_-]{6,16}^/3.当表单失去焦点就开始验证4.如果符合规范，则让后面的标签添加right类5.如果不符合规范，则让后面额标签添加wrong类表单验证分析1.手机号码：/^1[3|4|5|7|8]\d{9}$/2.QQ：/^[1-9]\d{4,}$/(腾讯QQ号从10000开始)3.昵称是中文：/^[\u4e00-\u9fa5]
2020-11-15 21:43:16
548
2
原创 普歌-飞灵团队【jquery】【toDoList】
toDoList① 文本框输入内容，按下回车，就可以生成待办事项② 点击待办事项复选框，就可以把当前数据添加到已完成事项里面③ 点击已完成事项复选框，就可以把当前数据添加到待办事项里面④ 但是本页面内容刷新页面不会丢失文章目录toDoList分析操作图片示例：分析不管按下回车，还是点击复选框，都是把本地存储的数据加载到页面中，这样保证刷新关闭页面不会丢失数据操作1.按下回车把新数据添加到本地存储里面2.本地存储数据渲染加载到页面3.删除操作4.正在进行和已完成选项操作代码演
2020-11-07 10:21:05
106
原创 普歌- 飞灵团队 【tab栏切换】 【下拉菜单】
tab栏切换当鼠标点击上面相应的选项卡（tab），下面内容跟随变换1.Tab栏切换有2个大的模块2.上的模块选项卡，点击某一个，当前这个底色会是红色，其余不变（排他思想）修改类名的方式3.下面的模块内容，会跟随上面的选项卡变化。所以下面模块变化写到点击事件里面4.规律：下面的模块显示内容和上面的选项卡一一对应，相匹配5.核心思路：给上面的tab_list里面的所有小li添加自定义属性，属性值从0开始编号6.但我们点击tab_list里面的某个小li，让tab_con里面对应序号的内容显示，其
2020-10-20 16:12:11
246
原创 普歌-飞灵团队【JavaScript】网页轮播图
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档【javaScript】网页轮播图动画函数的封装案例：网页轮播图==引入相关样式==利用JS实现轮播图效果---`index.js`动画函数的封装##因为js较多，我们单独新建一个js文件 animate.js，然后引入页面中定时器：function animate(obj, target, callback) { //先清除以前的定时器，只保留当前的一个定时器执行 clearInter
2020-10-18 11:01:54
165
原创 普歌-飞灵团队 【倒计时效果】
倒计时效果核心算法输入的时间减去现在的时间就是剩余的时间，即倒计时，但是不能按着时分秒相减，比如 05 分 减去 25 分，结果会是负数的因此用时间戳来做用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数。转换把剩余时间总的毫秒数转换为天、时、分、秒（时间戳转换为时分秒）转换公式如下： d = parseInt(总秒数/60/60/24); //计算天数 h = parseInt(总秒数/60/60%24); //计算小时 m =
2020-10-03 22:04:28
119
原创 JavaScript之Date()(日期对象）
JavaScript之Date()(日期对象）Date() 日期对象 是一个构造函数 必须使用new 来调用创建我们的日期对象var arr = new Array(); //创建一个数组对象var obj = new Object(); //创建了一个对象实例它的使用会有以下几种：1.使用Date 如果没有参数 返回当前系统的当前时间 var date = new Date(); console.log(date);2.参数常用
2020-10-03 21:32:18
156
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人