ldd_eb的博客

原创 vue路由守卫

比如说，当点击商城的购物车的时候，需要判断一下是否登录，如果没有登录，就跳转到登录页面，如果登陆了，就跳转到购物车页面，相当于有一个守卫在安检1：全局钩子： beforeEach、 afterEach2：独享守卫（单个路由里面的钩子）： beforeEnter3：组件内守卫：beforeRouteEnter、beforeRouteLeave①to: Route: 即将要进入的目标路由对象（to是一个对象，是将要进入的路由对象，可以用to.path调用路由对象中的属性）

原创 基于vue-cli创建vue2工程

原创 vue脚手架配置代理（解决跨域问题）

跨域问题是指协议，主机，端口有一个以上不同解决方法：1，cors(最标准）2，jsonp（script src）（比较巧妙）3，代理服务器（最常用）(1) nginx比较难需要对后端比较熟悉，一般用第二种(2）vue-cli流程：端口为8080的主机要向端口为5000的主机发送请求需要一个端口为8080的代理服务器（图上粉色）8080的主机向8080的代理服务器发送请求（没有跨域问题）

原创 vue动画、过渡效果

transition标签改为transition-group ，每个过渡的元素要有key值animate.css可以在npm官网中搜索1.安装插件2.引入

原创 vue3一些API

通过使用 shallowRef() 和 shallowReactive() 来绕开深度响应。浅层式 API 创建的状态只在其顶层是响应式的，对所有深层的对象不会做任何处理，避免了对每一个内部属性做响应式所带来的性能成本，这使得属性的访问变得更快，可提升性能。

原创 vue3组件通信(二）

数据在组件的自身（子组件），但根据数据生成的结构需要组件的使用者（父组件）来决定。（新闻数据在News组件中，但使用数据所遍历出来的结构由App组件决定）注意：$attrs会自动排除props中声明的属性(可以认为声明过的 props 被子组件自己“消费”了)$attrs用于实现当前组件的父组件，向当前组件的子组件通信（祖→孙）。$refs：值为对象，包含所有被ref属性标识的DOM元素或组件实例。$ attrs是一个对象，包含所有父组件传入的标签属性。$parent：值为对象，当前组件的父组件实例对象。

原创 vue3组件通信(一）

emit()传递事件名和具体参数defineEmit()声明可以触发的事件原生事件：1.事件名是特定的（click、mosueenter等等）2.事件对象$event: 是包含事件相关信息的对象（pageX、pageY、target、keyCode）自定义事件：1.事件名是任意名称2.事件对象$event:是调用emit时所提供的数据，可以是任意类型！！！3.命名方式尽量不要驼峰式，而是采取keybab-case式，即send-toy父组件

原创 vue3pinia

目录是storeStore 包含了状态（state）、获取器（getters）和操作（actions）,相当于组件中的： data、 computed 和 methods。Store是一个保存：状态、业务逻辑 的实体，每个组件都可以读取、写入它。

原创 vue3路由

2.路由组件：靠路由规则渲染出来的。1.路由组件通常存放在pages 或 views文件夹，一般组件通常存放在components文件夹。1.引入创建路由器并暴露，引入可能用到的路由组件 router/index.ts。history:createWebHistory(), //history模式。缺点：后期项目上线，需要服务端配合处理路径问题，否则刷新会有404错误。优点：URL更加美观，不带有#，更接近传统的网站URL。作用：控制路由跳转时操作浏览器历史记录的模式。3.一般组件：亲手写出来的标签。

原创 vue3核心语法（二）

newValue和oldValue值相同，都是新值，还是因为对象地址值没有改变，本质上assign在原对象上进行的是赋值。监视ref定义的【对象类型】数据：直接写数据名，监视的是对象的【地址值】，若想监视对象内部的数据，要手动开启深度监视。若修改的是ref定义的对象中的属性，newValue 和 oldValue 都是新值，因为它们是同一个对象。监视ref定义的【基本类型】数据：直接写数据名即可，监视的是其value值的改变。立即运行一个函数，同时响应式地追踪其依赖，并在依赖更改时重新执行该函数。

原创 vue3核心语法(一)

修改名字

原创 基于vite创建vue3工程

【代码】基于vite创建vue3工程。

原创 Buffer模块（nodejs)

Buffer 是一个类似于数组的 对象 ，用于表示固定长度的字节序列。Buffer 本质是一段内存空间，专门用来处理 二进制数据。

原创 模块化（一）nodejs

模块化 是指解决一个 复杂问题 时，自顶向下逐层 把系统划分成若干模块的过程。对于整个系统来说， 模块是可组合、分解和更换的单元。1 .现实生活中的模块化2 .编程领域中的模块化编程领域中的模块化，就是 遵守固定的规则 ，把一个 大文件 拆成 独立并互相依赖 的 多个小模块。把代码进行模块化拆分的好处：① 提高了代码的 复用性② 提高了代码的 可维护性③ 可以实现 按需加载。

原创 path+HTTP协议+IP+端口(nodejs)

node.js运行环境让js可以实现其他后端语言几乎所有的语言，只要会js基本语法就能在node环境下进行后端开发。http模块专门用来创建服务的，就是把命令行窗口当成服务器来用，只支持http协议。req.on(“data”) 数据抓取使用有限制所以回调函数中要使用变量累积。req.url() 即可提取地址栏的数据不包括域名和端口号。创建服务的同时应该创建端口进行监听。console.log(req)//请求信息。console.log(res)//响应信息。console.log(“监听成功”);

原创 FS模块（node.js）

fs全称为file system，称之为文件系统，是Node.js中的内置模块，可以对计算机中的磁盘进行操作。

原创 jQuery事件导读+其它方法

单个事件叫注册，多个事件叫处理。不会触发事件默认行为。

原创 jQuery效果2

attr()，自定义属性,可获取H5自定义属性，写date-（）scrollTop(),scrollLeft,可获取，可修改。date()，可获取H5自定义属性,不写date-（）position()，只获取，不修改。内部添加元素，生成之后，是父子关系。外部添加元素，生成之后，是兄弟关系。toFixed(2)保留两位小数。parents()可返回全部祖先。offset()，可获取，可修改。内容包括标签和文本内容。pop()，固有属性。文本内容text()

原创 jQuery效果1

j是javaScript,query是查询的意思，即查询jsjQuery是JavaScript中的一种，常见JavaScript还有jQuery,prototype,YUI,DoJo,Extjs,移动端zeptojQuery中封装了js常用功能代码，学习jQuery的本质是学习调用这些函数jQuery的使用包括：1.从官网上引入jQuery.min.js2.入口函数入口函数，一般用第一种顶级对象$相当于jQueryDOM对象和jQuery对象的区别。

原创 移动端网页特效导读

与插件相比，大而全用法：官网下载文件引入bootstrap.min.css先引入jquery.min.js,再引入bootstrap.min.js复制结构和样式。

原创 PC端网页特效异读

其他，opacity是半透明的意思。

原创 Web API之BOM

简介：BOM是浏览器对象模型，缺乏标准，兼容性较差全局作用域中的变量和函数会变成window对象的属性和方法一个特殊属性window.name。

原创 高级事件.

removeEventListener(事件操作，事件名字）事件侦听注册：不带on，可添加多个监听器，不会覆盖依次执行。高版本e.preventDefault();非标准e.cancelBubble=true;detachEvent(事件操作，事件名字）标准e.stopPropagation();低版本e.returnValue;捕获阶段，当前目标阶段，冒泡阶段。带on，解决封装，兼容性函数。然后在方法中添加禁止默认事件。attchEvent了解。false冒泡阶段，默认。事件对象的常见属性和方法。

原创 Web API之DOM

1.获取属性值element.属性2.设置属性值element.属性=值element.setAttribute(属性，值）3.移除属性例子、tab栏切换H5自定义属性date-开头dateset是一个存放所有date开头的自定义属性获取时驼峰。

原创 javaScript基础3

一组无序的相关属性和方法的集合。

原创 javaScript基础2

true返回表达式1，false返回表达式2。2.递增递减运算符：++ –5.逻辑运算符：&&/||/！###（3）.switch语句。单独使用时一样，运算时不一样。=/ ==/ ===三者区别。1.算法运算符：±*/%

原创 javascript基础1

高级语言：java c++ python javascript。字面量：一般可以直接看出数据类型，也可以根据后台颜色来判断。解释型语言（Java）和编译型语言（JavaScript）字符串长度及拼接（一个方法（变量名.length））js组成（javascript、DOM、BOM)多行/* */ shift+ctrl+a。渲染引擎：解析html和css。标记语言：css html。html/css/js关系。单行// ctrl+/输入 输出 打印信息。eg.交换两个变量的值。js引擎：js解释器。

原创 响应式布局（其次）

原理布局容器应用例子代码块二.bootstrap前端开发框架通栏不需要container想要改变样式可以添加类名，覆盖样式

原创 less+rem+媒体查询布局(主流)

子类自身/伪类。

原创 flex弹性布局（主流）

概念属性。

原创 流式布局及jdmf(主流)

一.流式布局二.一些注意事项

原创 移动端基础

pc是1px=1个物理像素但是移动端不尽相同所以有了多倍图

原创 css3之3D转换transform

黑马程序员pink老师等你

原创 css3之动画animation

1.定义（在style中定义）（2）使用。

原创 css3之2D转换transform

1，单位deg2,+顺，-逆3，默认旋转中心是中心点（1）css三角即^（只需设置右边框和下边框）(2)旋转效果（1）按旋转中心缩放且旋转中心可改变（2）不会影响其他盒子（1）图片放大（鼠标经过时）（溢出用overflow，谁做过渡给谁用transition）（2）分页按钮

原创 html5新增标签+css3新增标签

关于n区别总结。

原创 css高级技巧

（根目录font——复制style.css到。style里——复制目标图标html到。里——设置font-family）

原创 css5定位

why定位模式边位移相当于标准流，无边位移eg：eg：绝对定位和固定定位和浮动类似不需要display即可有行内块属性浮动的盒子也不会只有标准流会but浮动不会

原创 css4浮动+清除浮动

标准流/普通流/文档流浮动定位普通流盒子中间默认有空隙且不知道空隙大小，有些布局普通流做不到，浮动可以方便控制盒子间的空隙（1）脱标（2）一行内显示且顶端对齐（3）具有行内块特征应用（1）额外标签法（空标签必须是块级元素）（2）overflow（3）：after伪元素发（复制调用）（4）双伪元素（复制调用）

原创 产品布局模板+品优购快报模板

【代码】一个产品布局模板。