自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

原创 小程序日期+周

样式展示由于小程序要做抽奖,要用到时间选择,奈何小程序的时间选择器不能实现就写了一个时间选择器废话不多说上代码日期处理// dateWeekPicker.js//用于判断是否在数字前加0function withData(param){ return param < 10 ? '0' + param : '' + param;}/** * 取时间的小时数 */function getLoopArray(start,end){ var start = start ||

2021-09-06 15:46:40 260

转载 微信小程序跑马灯

话不多说先上展示效果接着上源码<view class="trumpet" <image src="/pages/res/icon-trumpet.png" class='noticeImg' /> <view class="example"> <view class="marquee_box"> <view class="marquee_text" style="{{orientation}}:{{marqueeDistance}}px;f

2021-04-02 10:46:12 147

原创 分享海报

1.渲染布局html<view class="option-content" style="margin-top:{{top}}px" wx:if="{{shopList.length}}"> <view wx:for="{{shopList}}" wx:key="index" class="option" bindtap="click" data-type="preview" data-id="{{item.goods_id}}"> <vi

2021-03-30 14:34:57 168

原创 类似于购物车

html代码<view class="option" wx:for="{{userList}}" wx:key="index" hover-class="none" catchtap="click" data-type="list" data-id="{{item.kid}}"> <view class="top"> <image src="{{item.avatar}}" class="avatar"></image&gt

2021-03-30 14:20:02 92

原创 普通函数与箭头函数的区别

箭头函数let fn = () => { console.log("我是箭头函数")}箭头函数相当于匿名函数,如果没有参数,就只写一个(),有参数直接写在(参数1,参数2)如果函数里面只有一个表达式,可以省略{}和return,如果有多个表达式则不能省略{}和return普通函数function fn(){ console.log("我是普通函数")}区别一:箭头函...

2020-04-14 22:33:26 118

原创 vue-router

现在的应用都流行SPA应用(single page application)传统的项目大多使用多页面结构,需要切换内容的时候我们往往会进行单个html文件的跳转,这个时候受网络、性能影响,浏览器会出现不定时间的空白界面,用户体验不好单页面应用就是用户通过某些操作更改地址栏url之后,动态的进行不同模板内容的无刷新切换,用户体验好。Vue中会使用官方提供的vue-router插件来使用单页面,...

2020-03-29 21:11:24 77

原创 Vue数据请求方式

vue-resource请求从vue的2.0开始,作者说:vue-resource不再维护了resource—get请求HTML: <div id="app"> <ul> <li v-for="book in books">{{book.title}}</li> </ul&gt...

2020-03-26 21:55:07 171

原创 Vue自定义指令

自定义指令自定义指令介绍directive 对普通DOM元素进行底层操作自定义指令注册当页面加载时,该元素将获得焦点 (注意:autofocus 在移动版 Safari 上不工作)。事实上,只要你在打开这个页面后还没点击过任何内容,这个输入框就应当还是处于聚焦状态。现在让我们用指令来实现这个功能:// 注册一个全局自定义指令 `v-focus`Vue.directive('focus'...

2020-03-25 22:08:39 159

原创 组件的生命周期

生命周期每一个组件或者实例都会经历一个完整的生命周期,总共分为三个阶段:初始化、运行中、销毁组件从创建到销毁的一系列过程叫做组件的声明周期。vue在整个生命周期里面提供了一些函数,可以在内部实现一些业务逻辑,并且这些函数会在一些特定的场合下去执行。(在生命周期的某一个时刻进行触发) 组件的生命周期钩子函数大致可以分为三个阶段:初始化、运行中、销毁 初始化阶段...

2020-03-24 22:41:11 499

原创 vue虚拟dom与key属性

虚拟DOM浏览器加载一个HTML文件的大致流程:1.构建DOM树2.构建Style Rules,页面的样式表3.把DOM树和样式表综合起来,形成Render Tree4.布局,为每个Render树上的节点确定在显示屏上出现的精确坐标值。5.绘制,调用每个节点的paint方法当用传统的方式操作DOM的时候,浏览器会从构建DOM树开始从头到尾执行一遍流程,效率很低。而虚拟DOM是用jav...

2020-03-23 21:53:41 148

原创 vue的双向绑定原理

vue数据双向绑定原理vue在创建vm的时候,会将数据配置到实例中,然后通过Object.defineProperty方法,为数据动态的添加getter与setter方法。当获取数据的时候,会触发对应的getter方法,当设置数据的时候,触发对应的setter方法。然后当setter方法触发完成的时候,内部会进一步触发watcher,当数据改变了,视图则更新操作完毕。实现原理let ...

2020-03-18 21:41:35 93

原创 mongodb简单封装

非关系型数据库mongodb的简单封装let mongodb = require("mongodb")let mongodCt = mongodb.MongoClientlet ObjectId = mongodb.ObjectId //把字符串转成ObjectId的对象类型//链接库/* dbName:数据库名称 默认值就是student collectionName...

2020-03-16 22:23:24 215

原创 node.js

优势性能高,方便,入门难度低劣势服务器提供的相对较少相对于其他语言,能用得上的学习资料少对程序员的要求高运行开发注意node.js 使用的事 ECMA 语法,不可以使用DOM BOM...

2020-03-10 21:40:59 336

原创 jQuery常用API

jQuery的特点优质的选择器和筛选器方便的隐士迭代强大的链式编程引入方法必须下载导入jQuery包也就是:jquery.js 或者 jquer.min.jsjQuery的选择器选择器——用来获取DOM元素的方法匹配id属性的属性值匹配clss属性的属性值,也就是类名匹配标签名称匹配标签结构匹配属性属性值选择器匹配组合选择器匹配结构伪类选择器jQuery的筛...

2020-03-10 16:58:43 247

原创 node.js的部分基础知识

前后端交互流程大后端 用户 - > 地址栏(http[s]请求) -> web服务器(收到) - > nodejs处理请求(返回静态、动态)->请求数据库服务(返回结果)->nodejs(接收)->node渲染页面->浏览器(接收页面,完成最终渲染)大前端 用户 - > http[s]请求 -> web服务器(收到) - > n...

2020-03-09 21:50:04 88

原创 前后端交互实现

列表页和详情页的实现列表页使用ajax请求在后端请求数据通过渲染在前端页面上html代码:<div class="goodsList"> <ul> </ul> </div>css代码:.goodsList { width: 1226px; margin: 0 auto; > u...

2020-03-06 20:56:52 281

原创 前后端交互

实现前后端交互从后端获取数据渲染在前端页面js代码:function getList() { $.ajax({ url: '../lib/nav_top.json', dataType: 'json', success: function (res) { console.log(res) // 4-1. 准备一个空...

2020-03-03 13:40:01 89

原创 理解JavaScript中部分设计模式

理解JavaScript中部分设计模式什么是设计模式在软件工程中,设计模式是软件设计中常见问题可重用的方案。设计模式代表着经验丰富的软件开发人员使用的最佳实践。设计模式可以被认为是编程模板。为什么使用设计模式许多程序员要么认为设计模式是浪费时间,要么他们不知道如何恰当地应用它们。 但是使用适当的设计模式可以帮助你编写更好,更易理解的代码,并且代码可以轻松维护,因为它更容易理解。最重...

2020-02-23 18:56:40 192

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除