- 博客(35)
- 收藏
- 关注
RSS订阅原创 前端路由、vue-router常见用法、路由重定向、动态路由匹配、声明式导航 & 编程式导航 、导航守卫
前端路由通俗易懂的概念：Hash 地址与组件之间的对应关系. 前端路由的工作方式① 用户点击了页面上的路由链接② 导致了 URL 地址栏中的 Hash 值发生了变化③ 前端路由监听了到 Hash 地址的变化④ 前端路由把当前 Hash 地址对应的组件渲染都浏览器中
2023-05-13 17:06:07
1246
2
原创 动态组件、插槽、自定义指令、Eslint和prettierrc配置、axios全局挂载
vue 中的自定义指令分为两类，分别是：⚫ 私有自定义指令在每个 vue 组件中，可以在 directives 节点下声明私有自定义指令。示例代码如下：使用自定义指令在使用自定义指令时，需要加上 v- 前缀。示例代码如下：为自定义指令动态绑定参数值在 template 结构中使用自定义指令时，可以通过等号（=）的方式，为当前指令动态绑定参数值：通过 binding 获取指令的参数值在声明自定义指令时，可以通过形参中的第二个参数，来接收指令的参数值：update 函数。
2023-05-12 15:16:03
1248
4
原创 安装axios依赖报错分析ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While
PS D:\桌面\电脑\code\vue2\day06\demo-3> npm i axios -S npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @vue/eslint-config-standard@6.1.0 npm ERR! Found: eslint-plugin-vue@8.7.1 npm ERR! node_modul
2023-05-12 13:48:08
1753
原创 生命周期、数据共享、ref引用、购物车案例
生命周期 & 生命周期函数生命周期（Life Cycle）是指一个组件从创建 -> 运行 -> 销毁的整个阶段，强调的是一个时间段。生命周期函数：是由 vue 框架提供的内置函数，会伴随着组件的生命周期，自动按次序执行。注意：生命周期强调的是时间段，生命周期函数强调的是时间点。
2023-05-10 17:32:55
380
1
原创 过滤器（filter）、watch 侦听器 、计算属性 、axios、vue-cli 的使用 、vue组件化
vue组件化1. 组件化开发指的是：根据封装的思想，把页面上可重用的 UI 结构封装为组件，从而方便项目的开发和维护。2. vue 中的组件化开发 vue 是一个支持组件化开发的前端框架。 vue 中规定：组件的后缀名是 .vue。之前接触到的 App.vue 文件本质上就是一个 vue 的组件。3. vue 组件的三个组成部分 每个 .vue 组件都由 3 部分构成
2023-05-05 18:04:39
959
6
原创 vue2--1. 内容渲染指令 2. 属性绑定指令 3. 事件绑定 4. v-model 指令 5. 条件渲染指令
构建用户界面用 vue 往 html 页面中填充数据，非常的方便框架框架是一套现成的解决方案，程序员只能遵守框架的规范，去编写自己的业务功能！要学习 vue，就是在学习 vue 框架中规定的用法！vue 的指令、组件（是对 UI 结构的复用）、路由、Vuex、vue 组件库只有把上面老师罗列的内容掌握以后，才有开发 vue 项目的能力！① 能够知道 vue 的基本使用步骤⚫ 导入 vue.js 文件⚫ new Vue() 构造函数，得到 vm 实例对象。
2023-04-27 18:29:35
638
1
原创 ◆ 前端工程化 ◆ webpack 的基本使用 ◆ webpack 中的插件 ◆ webpack 中的 loader ◆ 打包发布 ◆ Source Map
什么是 webpack概念：webpack 是前端项目工程化的具体解决方案。主要功能：它提供了友好的前端模块化开发支持，以及代码压缩混淆、处理浏览器端 JavaScript 的兼容性、性能优化等强大的功能。好处：让程序员把工作的重心放到具体功能的实现上，提高了前端开发效率和项目的可维护性。注意：目前 Vue，React 等前端项目，基本上都是基于 webpack 进行工程化开发的。
2023-04-26 10:21:19
520
3
原创 node使用、fs文件系统模块、path路径模块、http模块
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 的官网地址： https://nodejs.org/zh-cn/3. Node.js 可以做什么Node.js 作为一个 JavaScript 的运行环境，仅仅提供了基础的功能和 API。
2023-04-24 19:25:30
187
原创 HTTP协议、HTTP请求消息、HTTP响应、HTTP请求方法、HTTP响应状态代码
通信，就是信息的传递和交换。通信的主体通信的内容通信的方式现实生活中的通信协议张三与李四采用写信的方式进行通信，在填写信封时，写信的双方需要遵守固定的规则。信封的填写规则就是一种通信协议。互联网中的通信协议客户端与服务器之间要实现网页内容的传输，则通信的双方必须遵守网页内容的传输协议。网页内容又叫做超文本，因此网页内容的传输协议又叫做超文本传输协议（HyperText Transfer Protocol） ，简称HTTP 协议。由于 HTTP 协议属于客户端浏览器和服务器之间的通信协议。
2023-04-19 23:10:08
372
原创 了解同源策略 JSONP 案例-淘宝搜索 防抖和节流
默认情况下，使用 jQuery 发起 JSONP 请求，会自动携带一个 callback=jQueryxxx 的参数，jQueryxxx 是随机生成的一个回调函数名称。CORS：出现的较晚，它是 W3C 标准，属于跨域 Ajax 请求的根本解决方案。注意：浏览器允许发起跨域请求，但是，跨域请求回来的数据，会被浏览器拦截，无法被页面获取到！现如今，实现跨域数据请求，最主要的两种解决方案，分别是 JSONP 和 CORS。同源指的是两个 URL 的协议、域名、端口一致，反之，则是跨域。
2023-04-18 17:09:09
310
原创 Ajax加强、XML的使用、数据交换格式、封装自己的Ajax函数、jQuery高级用法、axios的使用
Axios 是专注于网络数据请求的库。相比于原生的 XMLHttpRequest 对象，axios 简单易用。相比于 jQuery，axios 更加轻量化，只专注于网络数据请求。axios发起GET请求axios 发起 get 请求的语法：参数// 请求的 URL 地址 var url = 'http://www.liulongbin.top:3006/api/get' // 请求的参数对象 var paramsObj = {
2023-04-17 19:58:33
202
1
原创 ajax中的模板引擎art-template
var result = ‘123456’.replace(‘123’, ‘abc’) // 得到的 result 的值为字符串 ‘abc456’模板引擎，顾名思义，它可以根据程序员指定的模板结构和数据，自动生成一个完整的HTML页面。// 得到 name 相关的分组信息。2.5.2 实现简易的模板引擎。封装 template 函数。导入并使用自定义的模板引擎。我是{{name}}我是{{name}}
2023-04-17 16:35:08
110
1
原创 Ajax第一天 服务器的基本概念与初识Ajax
接口文档，顾名思义就是接口的说明文档，它是我们调用接口的依据。好的接口文档包含了对接口URL，参数以及输出内容的说明，我们参照接口文档就能方便的知道接口的作用，以及接口如何进行调用。之前所学的技术，只能把网页做的更美观漂亮，或添加一些动画效果，但是，Ajax能让我们轻松实现网页与服务器之间的数据交互。XMLHttpRequest（简称 xhr）是浏览器提供的 js 成员，通过它，可以请求服务器上的数据资源。数据的增删改查：数据的添加、删除、修改、查询操作，都需要通过 ajax 的形式，来实现数据的交互。
2023-04-15 16:55:28
98
原创 Web APIs 第七天 正则表达式
定义正则表达式语法：let 变量名 = /表达式/1.判断是否有符合规则的字符串：test() 方法 用来查看正则表达式与指定的字符串是否匹配变量名.test(被检测的字符串)2.检索（查找）符合规则的字符串：exec() 方法 在一个指定字符串中执行一个搜索匹配变量名.exec（被检测字符串）正则表达式检测查找 test方法和exec方法有什么区别？1.test方法 用于判断是否有符合规则的字符串，返回的是布尔值 找到返回true，否则false2.exec方法用于检索（查找）符合规则的字符
2023-04-12 17:34:44
143
1
原创 Web APIs 第六天 BOM- 操作浏览器
·BOM(Browser Object Model ) 是浏览器对象模型·window 是浏览器内置中的全局对象，我们所学习的所有 Web APIs 的知识内容都是基于 window 对象实现的·window 对象下包含了 navigator、location、document、history、screen 5个属性，即所谓的 BOM ·document 是实现 DOM 的基础，它其实是依附于 window 的属性。·注：依附于 window 对象的所有属性和方法，使用时可以省略 window
2023-04-10 19:07:14
299
3
原创 Web APIs第五天 DOM-网页特效篇
很多网页需要检测用户把页面滚动到某个区域后做一些处理， 比如固定导航栏，比如返回顶部。需求：当页面滚动500像素，就显示返回顶部按钮，否则隐藏， 同时点击按钮，则返回顶部。③：让页面的 scrollTop 走到 对应 内容 的 offsetTop。②：检测页面滚动大于等于 秒杀模块的位置 则滑入，否则滑出。③：点击按钮，则让页面的scrollTop 重置为 0。需求：当页面滚动到秒杀模块，导航栏自动滑入，否则滑出。②：检测页面滚动大于等于100像素，则显示按钮。①：用到页面滚动事件。
2023-04-08 17:30:36
268
4
原创 Web ApIs第四天 事件对象和事件委托
1. e 就是一个事件对象 写到我们侦听函数的 小括号里面 当形参来看。2.事件对象的命名是不固定的，也可以不叫e，但是最好用e或者evt表示，这是规范。2. 事件对象只有有了事件才会存在，它是系统给我们自动创建的，不需要我们传递参数。4. e是谁触发就指向谁
2023-04-06 17:49:24
148
原创 Web ApIs第三天 DOM节点操作和时间对象
1. 什么是DOM 节点？ DOM树里每一个内容都称之为节点2. DOM节点的分类？ 元素节点 比如 div标签 属性节点 比如 class属性 文本节点 比如标签里面的文字3. 我们重点记住那个节点？ 元素节点 可以更好的让我们理清标签元素之间的关系
2023-04-04 17:20:28
183
原创 Web ApIs第二天（事件的使用）
1. 什么是事件？ 事件是在编程时系统内发生的动作或者发生的事情 比如点击按钮 click 2. 什么是事件监听？ 就是让程序检测是否有事件产生，一旦有事件触发，就立即调用一个函数做出响应，也称为 注册事件3. 事件监听三要素是什么？ 事件源 (谁被触发了) 事件 (用什么方式触发，点击还是鼠标经过等) 事件处理程序 （要做什么事情）
2023-04-02 20:14:14
183
原创 css盒子模型
最专业的解决办法：给父元素设置overflow：hidden。光标来离符号近是英文，如果距离远，说明就是中文符号。行内 id 类 标签的个数来进行比较，继承最低。png的图片用设计去量，psd的图片用开发模式。遇到样式不出来，要学会通过调试工具找错。padding可以当做复合属性使用。border-方位名词。后面跟四个值：上右下左。盒子与盒子之间的距离。
2023-01-01 14:56:51
54
原创 css进阶
控制文字的属性可以继承，继承出意外的是a标签不能继承，h系列标签的font-size会继承失效。块级标签作为大容器，可以嵌套文本、块级元素、行内元素、行内块级元素等等。a标签的color会继承失效，h系列标签的font-size会继承失效。background-image:url(‘图片的路径’)a标签内部可以嵌套如何元素，但是不能嵌套自己a标签。取值的时候是正数，负数的话向左和向上运动。：一行显示多个，宽高默认，不可以设置宽高。：一行显示多个，可以设置宽高。后边的层叠前边的，优先级相同。
2022-12-27 20:59:48
243
原创 css引入
font-weight ：100-900 整百数， 正常大小是400 ，加粗是700。font-style：是否倾斜 normal litalic:倾斜 em标签是倾斜。*{} 所有的标签都可以选定 可以去除内外边距（以后）css属性：（属性名）color：（属性值）red；font-size 数值+px 谷歌默认16px。css写在style标签里面，在title下面。以后会遇到：后面会有多个值的写法，复合属性。居中text-align：center。p{ }选中所有的标签生效，有好有坏。
2022-12-23 21:58:15
57
1
原创 html各种标签
场景：在网页的底部导航中通常会使用自定义列表实现。~dl：表示自定义列表的整体，用用于包裹dt/dd标签~dt：表示自定义列表的主题~dd：表示自定义列表的针对主题的每一项内容dd 前会默认显示缩进效果如果有问题的话，大家可以在评论区提醒一下。
2022-12-02 15:48:58
214
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人