2 码小余の博客

学生身份

我要认证

越努力,越幸运! 个人博客:https://extheor.github.io/ 技术/自考 方向:Web前端

等级
TA的排名 1w+

安装Babel

安装Babel使用以下命令安装 Babel packages:npm install --save-dev @babel/core @babel/cli @babel/preset-envnpm install --save @babel/polyfill如果感觉安装的慢,可以加上淘宝镜像:--registry=https://registry.npm.taobao.org配置Babel在工程项目的根目录下创建 package.json 配置文件,该配置文件内容如下:{ "preset

2020-10-24 11:44:07

B站秋季头部动画

B站秋季头部动画实现步骤1.实现一个多图层组合的静态界面2.实现不同图层不同清晰度配置3.实现鼠标左右移动导致的清晰度变化4.实现鼠标左右移动导致的跟随位移5.实现小女生的眨眼效果6.实现鼠标离开时整个效果的还原index.html<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" conte

2020-10-12 17:54:06

Nodejs博客开发笔记

Nodejs博客开发笔记(持续更新)接口设计描述接口方法url参数备注获取博客列表/api/blog/listgetauthor 作者,keyword 搜索关键字参数为空的话,则不进行查询过滤获取一篇博客的内容/api/blog/detailgetid新增一篇博客/api/blog/newpostpost中有新增的信息更新一篇博客/api/blog/updatepostidpostData中有更新的内容删除一篇博客/ap

2020-09-29 00:14:06

Vue组件传值

Vue组件传值什么是组件?这里有一个 Vue 组件的示例:// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>'}

2020-09-25 16:52:56

Vue生命周期

Vue生命周期下图展示了实例的生命周期。你不需要立马弄明白所有的东西,不过随着你的不断学习和使用,它的参考价值会越来越高。<div id="app"> <h1>{{ msg }}</h1></div>var app = new Vue({ el: "#app", data: { msg: "helloVue", className: "redBg" }, beforeCreat

2020-09-25 13:00:45

Vue动画实现

Vue动画实现过渡动画Vue 提供了 transition 的封装组件,在下列情形中,可以给任何元素和组件添加进入/离开过渡条件渲染 (使用 v-if)条件展示 (使用 v-show)动态组件组件根节点这里是一个典型的例子:<div id="app"> <!-- 属性name会跟框架追加的类名一致 --> <transition name="fade"> <div v-if="isShow" class="cont

2020-09-25 12:08:27

Vue -- 指令【学习笔记】(持续更新)

Vue – 指令【学习笔记】(持续更新)记录了Vue第三天的学习笔记v-show注意,v-show 不支持 <template> 元素,也不支持 v-else。带有 v-show 的元素始终会被渲染并保留在 DOM 中。v-show 只是简单地切换元素的 CSS property display。<div id="app"> <div v-show="shouye">首页</div> <div v-show="dong

2020-09-25 12:06:56

Vue版todolist案例

Vue版todolist案例todolist – 记录你的待办事项<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Vue版todolist案例</title> <style type="text/css"> *{ margin: 0;

2020-09-25 00:08:40

Vue侧边栏案例

Vue — 侧边栏案例使用 :class 的方式<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>菜单栏</title> <style type="text/css"> *{ margin: 0; padding: 0; } .page{ width: 100vw; height: 1

2020-09-24 00:30:11

Vue介绍

Vue介绍可以从Vue官方文档中学习,也可以从B站中去学习,我是看了两个课程大纲Vue是什么Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。起步尝试 Vue.js 最简单的方法是使用 Hello World 例子。你可

2020-09-19 17:52:26

京东抽奖项目开发笔记

京东抽奖项目开发笔记前言:这是一个独立项目,这个项目会由我们四个人来一起完成,所以首先就要分工合作,我是写前端的,所以我会先把基本的页面写出来1.注册页这是注册页的代码<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>Document</title> </head> <link rel="stylesheet

2020-09-17 09:13:08

京东投票项目开发笔记

京东投票项目开发笔记打开项目$yarn install / $ npm install: 跑环境(把项目依赖的插件进行安装)$node admin.js: 启服务(把自己的计算机作为服务器,创建一个指定端口的服务,来管理后台程序->后台程序会根据客户端请求的需求,把对应的数据和业务逻辑实现)API.TXT: API接口文档真实项目中,后台开发人员会给前端开发人员提供一个技术文档(接口文档),文档中描述了前端需要调取后台的某些接口实现的某些功能,并且标注了请求的地址、请求方式、传递给服

2020-09-13 14:21:16

NodeJs取参的四种方法

NodeJs 取参的四种方法参考:https://my.oschina.net/u/2519530/blog/535309 ????获取请求很中的参数是每个web后台处理的必经之路,nodejs的 express框架 提供了四种方法来实现。req.bodyreq.queryreq.paramsreq.param()首先介绍第一个req.body官方文档解释:Contains key-value pairs of data submitted in the request body. B

2020-09-11 08:04:28

MongoDB基本用法

MongoDB基本用法1.使用数据库、创建数据库use itying如果真的想把这个数据库创建成功,那么必须插入一个数据。数据库中不能直接插入数据,只能往集合(collections)中插入数据。下面命令表示给itying数据库的user表中插入数据。db.user.insert({"name":"xiaoming"});2.查看数据库show dbs3.显示当前的数据集合(mysql中叫表)show collections4.查询数据集合中的数据db.user.find()

2020-09-11 00:18:24

京东抽奖案例

京东抽奖案例0.设计思路项目呢是模仿的王者荣耀抽奖界面的一部分。。。1.目录结构|-- app.js|-- router.js 路由接口文件|-- controllers 控制器|-- models|-- node_modules 第三方包|-- package.json 包描述文件|-- package-lock.json 第三方包版本锁定文件(npm 5 以后才有)|-- public 公共的静态资

2020-09-10 00:56:31

axios中文文档

axios中文文档安装使用 npm:$ npm install axios使用 bower:$ bower install axios使用 cdn:<script src="https://unpkg.com/axios/dist/axios.min.js"></script>案例执行 GET 请求// 为给定 ID 的 user 创建请求axios.get('/user?ID=12345') .then(function (response) {

2020-09-08 10:04:55

JSONP

JSONPJSONP是什么JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的JSON资料,而这种使用模式就是所谓的JSONP。<script>元素实现网页通过添加一个 <script> 元素,向服务器请求JSON数据,这种做法不受同源政策限制;服务器收到请求后,将数据放在一个指定名字的回调函数里传回来。functio

2020-09-05 20:12:48

常见跨域

常见跨域HTML页面中一些允许指定路径的元素具有跨域特性:<link> 元素<script> 元素<img> 元素<ifrane> 元素<script src="https://cdn.bootcss.com/iquery/3.3.1/jquery.is"></script><link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.css"

2020-09-05 20:12:05

跨域访问是什么

跨域访问是什么同源策略1995年,同源政策由Netscape公司引人浏览器。目前,所有测览器都实行这个政策。同源政策的目的,是为了保证用户信息的安全,防止恶意的网站窃取数据。随着互联网的发展,“同源政策”越来越严格。目前,如果非同源,共有三种行为受到限制:】Cookie、LocalStorage和IndexDB无法读取DOM无法获得AJAX请求不能发送虽然这些限制是必要的,但是有时很不方便,合理的用途也受到影响。所谓“同源”指的是“三个相同”: 协议相同、域名相同以及端相同。域名是什么

2020-09-05 20:11:35

搜索提示框效果

搜索提示框效果首先写静态页面<div class="container"> <!-- 搜索框 --> <input type="text" id="search" /> <!-- 动态提示的数据框liebia --> <div id="alert"> <ul></ul> </div></div>CSS样式* { mar

2020-09-04 17:11:25

查看更多

勋章 我的勋章
  • 领英
    领英
    绑定领英第三方账户获取
  • GitHub
    GitHub
    绑定GitHub第三方账户获取
  • 脉脉勋章
    脉脉勋章
    绑定脉脉第三方账户获得
  • 签到达人
    签到达人
    累计签到获取,不积跬步,无以至千里,继续坚持!
  • 阅读者勋章Lv2
    阅读者勋章Lv2
    授予在CSDN APP累计阅读博文达到7天的你,是你的坚持与努力,使你超越了昨天的自己。
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv4
    勤写标兵Lv4
    授予每个自然周发布9篇以上(包括9篇)原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。
  • 学习力
    学习力
    《原力计划【第二季】》第一期主题勋章 ,第一期活动已经结束啦,小伙伴们可以去参加第二期打卡挑战活动获取更多勋章哦。
  • 原力新人
    原力新人
    在《原力计划【第二季】》打卡挑战活动中,成功参与本活动并发布一篇原创文章的博主,即可获得此勋章。
  • 分享学徒
    分享学徒
    成功上传1个资源即可获取