- 博客(29)
- 收藏
- 关注
RSS订阅原创 vue从零开始搭建项目
先安装包管理器node.js，确定要用到的版本（nvm转换版本），接着安装npm或者国内镜像cnpm，终端中全局安装vue、vue-cli（脚手架）、vue-router、webpack（模块打包器），用代码编译器VS code进入文件夹，下载vue脚手架选择指定的插件，选完之后就先运行一次代码是否正常执行，最后开始编写代码。
2024-10-16 22:38:30
64
原创 前端开发的未来展望
近期展望：技术技能的提升，深入掌握现有的技术（框架和组件库、构建工具的使用），学习新的技术（现在发展迅速，新的技术迭代也快）长远展望：发展期、稳定期、提升期。
2024-10-15 17:53:38
84
原创 前端项目的介绍
商品列表页：根据分类、品牌、价格条件筛选商品、支持关键字搜索（网络请求axios、搜索框的设计定位展示）首页（导航栏，轮播图、侧边栏）：展示推荐的商品、促销活动等信息。订单管理：创建订单、查看订单的状态、取消订单等增删改查的功能。用户中心：用户可以查看个人信息、修改密码、管理收获地址等。商品详情：利用弹出框介绍商品的信息。
2024-10-15 17:37:01
86
原创 前端项目中遇到的技术问题
解决方案：使用css的媒体查询（media queries）针对不同屏幕下应用特定的样式、采用弹性盒布局flexbox布局实现更灵活的响应式布局。采用bootstrap之类的前端框架提供的响应式工具类。协议、域名、端口任意一个任意一个不同的时候，就会产生跨域问题。cors是后台解决方案，proxy是我常用的，get请求target输入服务器地址，changeOrigin设置为true。页面加载过长、图像加载慢。解决方案：代码分割，按照需求加载模块，减少初始的加载量或者使用懒加载、资源压缩、cdn加速。
2024-10-15 17:11:11
264
原创 ES6有哪些新特性
1.let和const：具有块级作用域，let用来声明变量科重新赋值，const用来声明常量不可再次赋值。4.解构赋值：一种javascript表达式，它允许从数组或对象中提取属性或值，并将这些值赋给其他变量。7.类与模块：通过class关键字定义类，使用import和export来导入和导出模块。11.其他：对象属性简写，属性和方法简写，提升了Javascript的编码效率和可读性。9.Symbol和迭代器：提供了一种新的原始数据类型和自定义迭代行为的方式。2.箭头函数：新的函数声明方式，语法简洁。
2024-10-15 10:45:12
739
原创 css用到哪些
3.1过渡：transition：设置属性变化时的过渡效果。浮动Float、清除浮动Clearfix、伪类和伪元素。3.2动画：animation：设置动画效果。盒模型、定位、弹性布局、网格布局。文字样式、背景和边框、媒体查询@media。
2024-10-14 20:45:36
225
原创 从输入网址到浏览器显示经历了那些过程
请求中包含了请求的方法(如GET)、请求的资源路径、协议版本以及一些请求头信息(如接受的内容类型、语言偏好等)。6.加载外部资源:在解析HTML的过程中，如果遇到外部资源(如CSS文件、JavaScript文件、图片等)，浏览0器会发起额外的HTTP请求来加载这些资源。页面加载完成后，用户可以与页面进行交互(如点击链接、填写表单等)。Web服务器接收到请求后，会进行相应的处理(如查询数据库、执行脚本等)，然后生成一个HTTP响应，包含状态码、响应头以及响应体(通常是HTML文档)。5.解析HTML内容:。
2024-10-10 22:14:00
475
原创 设置css样式不显示
4.使用position：absolutr；结合left：-9999px；或者top：-9999px；将元素定位到屏幕外，用户无法看见，同时也不影响其他元素的布局。3.使用opacity：0；元素的透明度为0，使得元素不可见，但它依然会影响页面布局，可以接收鼠标事件等交互。1.使用display：none；完全移除元素，使其在页面布局中不再占用任何空间。2.使用visibility：hidden；元素被隐藏，但它仍然占据页面上的空间。
2024-10-10 21:53:48
283
原创 前端怎么生成一个列表
直接在HTML文件中写入列表标签。HTML支持两种类型的列表：无序列表<ul>、有序列表<ol>。每个列表项都用<li>标签表示。
2024-09-19 21:16:50
167
原创 Bootstrap的组件
1、栅格系统：用于创建灵活且响应式的布局。2、导航：创建顶部菜单、标签页等。3、按钮：提供各种样式的按钮。4、表单：包括基本表单控件的样式。5、图片：图片的样式调整。6、表格：增强表格的视觉效果。7、辅助类：提供简单的类来修改颜色、显示/隐藏元素等。
2024-09-18 22:28:42
571
原创 HTML5新增的标签
summary>：用于元素内的摘要或标题，点击时可以展开或收起详情信息。：代表文档或页面中的独立内容，如博客文章、论坛帖子等。：定义一个页面或节的底部，通常包含版权信息、联系方式等。：定义一个页面或节的头部，通常包含导航链接、logo等。：定义元素的标题或说明文字。：代表文档中的一个独立部分，如章节、页眉或导航栏。：代表文档或文档区域的主要内容，直接与文档的主题相关。
2024-09-18 21:50:35
158
原创 标签之间的区别
head>：包含关于文档的信息，如标题、样式表、脚本等，不显示在页面上。DOCTYPE>：定义文档类型，告诉浏览器应该按照那种标准解析文档。：包含所有的其他元素的根元素，定义了整个HTML文档。：定义文档的标题，在浏览器的标签页上显示。定义了网页的内容结构和语义，不同的标签有不同的用途。：包含文档的所有可见内容。
2024-09-16 21:22:45
234
原创 前端底层原理
前端开发的底层原理涉及多个方面，包括但不限于HTML/CSSjavaScript的基础知识、浏览器渲染机制、网络通信协议、前端框架的实现原理等。HTML5 是 HTML 的最新版本，引入了许多新特性，如<video>、<audio>、<canvas>等标签以支持多媒体内容和绘图功能。前端框架如 React、Vue.js 和 Angular，提供了声明式的编程模型，使得开发者可以更容易地构建复杂的用户界面。HTML是用来描述网页结构的语言，它由一系列元素组成，这些元素可以添加文本、图片、链接等内容到网页中。
2024-09-16 17:34:04
994
原创 vue组件生命周期
每个组件在被创建时都要经过一系列的初始过程，例如，需要设置数据监听，编译模版，将实例挂载到DOM并在数据变化时更新DOM等，同时在这个过程中也会运行一些叫做生命周期钩子的函数，卸载前后：beforeUnmount、Unmounted。创建前后：beforeCreate、Created。更新前后：beforeUpdate、Updated。渲染前后：beforeMount、Mounted。代码执行顺序固定，与编写顺序无关。
2024-09-09 20:44:00
130
原创 vue状态管理核心（vuex）
mutation（更改）常用事件配合使用。action（异步操作）为异步做准备。state（存储状态）getter（过滤）
2024-09-08 22:57:41
169
原创 vue3的新特性
4.“碎片”，Teleport即Protal传送门，“悬念”；2.可以将无用模块“剪辑”，仅打包需要；1.性能要比vue2.0强；6.暴露了自定义渲染API。5.更优秀的TS支持；
2024-09-08 22:18:14
80
原创 节流的含义
如果短时间内大量触发同一事件，那么在函数执行一次之后，该函数在指定的时间期限内不再工作，直到过了这段时间才重新生效。如果在限定的时间段内，不断触发滚动事件只要停止就不会输出。：支持输入实时数据可以用节流。
2024-09-06 17:52:06
74
原创 防抖的含义
实现：在于定时器SetTimeout()函数，用一个变量保存计时，考虑到维护全局纯净，可以借助闭包来实现。防抖的定义：对于短时间内连续触发事件，防抖就是让某个时间期限内事件处理函数只执行一次。防抖节流应该算属性优化的知识，处理不当或者放任不管就容易引起浏览器卡死。2.resize事件（页面适配）
2024-09-06 17:43:16
87
原创 路由嵌套配置
4.添加子路由跳转链接. <rouer-link to=""></>2.在路由配置文件中添加子路由配置. childreb:[ ]3.指定子路由显示位置. <router-view></>5.重定向配置. redirect:"全路径"1.创建子路由要加载显示的页面。
2024-09-04 21:23:29
118
原创 promise的理解
通过new promise构造函数来创建一个promise对象，构造函数接受一个执行器函数，该函数带有resolve和reject两个参数，执行器内部的代码是同步执行的，但可以调用resolve或reject来改变promise的状态。概念：promise是javascript中用来处理异步操作的对象，有三种状态：pending（等待中）、fulfilled（已成功）和rejected（已失败）.then：接收两个参数，一个fulfilled状态的回调函数，一个rejected状态的回调函数。
2024-09-04 17:27:47
222
原创 路由传递参数
component: () => import(" ../ / /组件路径")<router-list to="/list/名字>. </>1️⃣.在路由配置中指定参数的key。3️⃣.在详情页读取路由携带的参数。页面跳转过程，是可以携带参数的。2️⃣.在跳转过程中携带参数。
2024-09-03 21:43:56
100
原创 弹性布局flexbox
flexbox是css3新引入的一种布局，用来创建灵活可伸缩的布局；平均：justify-content:space-between;在flexbox模型中，容器中的子元素可以自动调整其尺寸和顺序。按比例分配空间：flex:1;垂直：flex-direction:colum;按顺序：order:1;水平：flex-direction:row;基本：display: flex;
2024-09-03 18:44:25
191
原创 箭头函数为啥不能做构建函数
3️⃣.和关键字new一起使用时会抛出错误。2️⃣.没有prototype属性。1️⃣.没有单独的.this绑定。4️⃣.不绑定arguments。
2024-09-03 10:15:33
357
原创 Vue路由配置
5.指定路由跳转：app.vue组件里 ---4.指定路由显示入口：app.vue组件里 1.安装路由：npm install --save vue-router。2.配置文件：src --> router --> index.js。注：圈红的组件：src --> views -->3.引入路由显示入口：main.js。
2024-09-02 21:25:58
377
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人