m0_59008364-CSDN博客

原创 vue实战商城后台管理系统：开篇＜一＞

左边是一列导航，上面是一个可以动态隐藏进去的按钮，右边就是退出登录一些操作。大概看下　要实现的页面长的样子　有什么功能。表格多选，删除，增删改查啥的。

2024-06-08 19:34:07 146

原创前端学习笔记：节流

例如百度输入框　每输入一次就刷新一次，因为人家服务器大。主要就是实现　间隔一段时间让它搜索一次，而不是一直搜索。节流和防抖一样，如果放任不管的话也容易引起浏览器卡死。用户按住滚动条不停的滚动，

2024-06-08 18:24:25 210

原创前端学习笔记：防抖（ｄｅｂｏｕｎｃｅ）

例如双十一，购买某个物品很多人在一直点按钮，会对服务器造成压力，每点一次向服务器发送一次请求。防抖问题如果放任不管的话　容易引起浏览器卡死。利用定时器来实现，在某个时间段内只能执行一次。

2024-06-08 17:46:00 173

因为生命周期函数使用率比较高，所以这块里面的代码也比较多，太多的话就会乱。一个函数放一个业务一个函数放一个业务加上注释　会更加清晰一些。Ｐｒｏｖｉｄｅ／Ｉｎｊｅｃｔ．　２．０也有　只不过使用率低，现在３.０做了增强。需要两个参数第一个是ｋｅｙ，上面的例子就是　ｃｕｓｔｏｍＶａｌ，第二个传递的值。生命周期比以前有优势，以前同一个生命周期函数只能存在一个，现在可以存在多个。引入　ｉｍｐｏｒｔ　｛　ｐｒｏｖｉｄｅ　｝　ｆｒｏｍ　＂ｖｕｅ＂只能父组件向子组件传递。

2024-06-08 17:28:08 130

原创前端学习vue：vue3新特性1

ｉｍｐｏｒｔ　　｛ｒｅｆ，ｒｅａｃｔｉｖｅ｝　ｆｒｏｍ　＂ｖｕｅ＂　需要哪个知识点引入哪个就会以上面优点里提到的，剪辑　效果引入进来。３.０　无法使用和２.０一样的ｔｈｉｓ　但是可以通过接收　ｓｅｔｕｐ（ｐｒｏｐｓ，ｃｔｘ）的方法　获取当前组件的实例和ｐｒｏｐｓ．。之前我们在＜ｔｅｍｐｌａｔｅ＞标签里显示的数据，都是在ｄａｔａ里定义好的，（开发者用的多一些）。先导入：ｉｍｐｏｒｔ　　｛ｒｅｆ，ｒｅａｃｔｉｖｅ｝　ｆｒｏｍ　＂ｖｕｅ＂ｒｅｆ　基本类型使用比较高，ｒｅａｃｔｉｖｅ　复杂类型使用比较高。

2024-06-08 17:10:05 241 1

原创前端学习vue：13.嵌套路由配置

路由嵌套，在路由配置文件里配置children。属于谁的就在谁下面加。这种二级导航，点击对应的显示对应的菜单和再点击菜单选项显示对应内容。redirect 重定向。

2024-06-08 10:11:36 102

原创前端学习：DOM之Ｄｏｃｕｍｅｎｔ对象＿方法＿获取元素

获取的内容是多个的话　可以通过索引来获取指定的。也可以获取　ｉｄ　．．．根据需求查看API。通过这些方法获取节点及内容进行需求开发。

2024-06-07 22:56:05 184

原创前端学习：DOM概述

DOM是ｊａｖａｓｃｒｉｐｔ操作网页的接口。全称为“文档对象模型”（Document　Ｏｂｊｅｃｔ　Model）。它的作用是将网页转为一个ＪａｖａＳｃｒｉｐｔ对象，从而可以用脚本进行各种操作（比如对元素增删内容）。DOM　是　JS　来操作网页的接口（变化）。

2024-06-07 22:49:43 196

原创＜十＞前端开发：列表标签之有序和无序列表

标签。有序列表是一列项目，列表项目使用数字进行标记。百战程序员尚学堂

2024-06-07 22:36:26 159

原创＜九＞前端开发：标签之文本

白菜

2024-06-07 22:26:52 102

原创＜八＞前端开发：标签之超文本链接

比如我们打开某一个网页，里面布满各种各样的超文本链接，一点击都会跳转到别的页面。使用href 属性赋值一个跳转链接就可以完成跳转。文本、图片、词句子都可以实现跳转。想跳转哪里跳转哪里，利用超文本链接实现。使用

2024-06-07 22:22:44 189

原创前端学习vue：12.Vue引入路由配置及路由传参

Vue Router是Vue.js的官方路由。它与Vue.js核心深度集成，让用Vue.js 构建单页应用变得轻而易举。第一步：安装路由 npm install --save vue-router.以前用一个a标签就可以跳转，在vue里推荐使用路由的方式管理。通过 vue-router路由管理页面之间的关系。一个项目就一个页面也可以跳转，用路由。// 配置信息中需要页面的相关配置。// 让外部可以访问把它设置导出。第二步：配置独立的路由文件。路由就是管理页面的关系。

2024-06-06 06:48:58 179

原创前端学习vue：11.Axios网络请求跨域解决方案

的 Ajax 请求，那么这个请求是同域的，因为资源路径的协议、域名以及端口号与当前域一致（例子中协议名默认为http，端口号默认为80）。需要注意的是，配置完成以后，需要重新运行 npm run serve 才可以生效。我们认为如果 “协议 + 域名 + 端口号” 均相同，那么就是同域。不是每个网络请求和每个接口都能拿到数据，JS采取的是同源策略。的 Ajax 请求，因为请求域 http://不同，那么这个请求就是跨域请求。的网站，它发起一个资源路径为。和发起请求的域 http://

2024-06-06 05:46:13 200

原创前端学习vue：10.Axios网络请求封装

/ 参考文档： https://www.kancloud.cn/yunye/axios/234845。然后在src下再创建个文件夹名字为api，在此文件夹下创建index.js和path.js。在日常应用过程中，一个项目中的网络请求会很多，此时一般采取的方案是将网络请求封装起来。console.log("服务器认证失败");// config: 包含着网络请求的所有信息。// 错误的处理才是我们需要最关注的。// 网络请求的公共配置。// 存放所有的网络请求路径。// 错误码信息处理。

2024-06-06 05:17:51 907

原创前端学习vue：9.组件的生命周期

例如：需要设置数据监听、编译模板、将实例挂载到DOM并在数据变化时更新DOM等。渲染时: beforeMount、mounted(用的比较多)更新（数据变化）时: beforeUpdate、updated。卸载时:beforeUnmount、unmounted。创建时: beforeCreate、created。卸载之前的函数里可以放把消耗性能的处理都干掉，比如定时器....的函数，这给了用户在不同阶段添加自己的代码的机会。创建完以后还没渲染，然后渲染前到渲染。然后在卸载前到卸载。不同节点做不同时期。

2024-06-06 04:03:46 179

原创前端学习vue：8.Props组件交互

Prop类型，传递参数没有类型限制，字符串、数组、对象 ...都可以。组件与组件之间是需要存在交互的，否则完全没关系，组件的意义就很小了。Prop是你可以在组件上注册的一些自定义 attribute。<h3>prop传递数据</h3>传递数量也没有限制。

2024-06-06 03:45:52 119

原创前端学习vue：7.自定义事件组件交互

自定义事件可以在组件中反向传递数据。pop 可以将数据从父组件传递到子组件，可以利用自定义事件实现 $emit.

2024-06-05 17:34:31 94

原创前端学习vue：6.组件基础

vue是组件化开发，单文件组件，后缀名为.vue结束。i组件单独独立，某个不能用了不会影响其他组件，修改也可以进行单独修改。一个文件存在三个部分。（html+js+css）通常一个应用会以一棵嵌套的组件树的形式来组织。

2024-06-05 14:23:23 173

原创前端学习vue：5.表单输入绑定

你可以用 v-model 指令在表单 <input>、<textarea>及<select>元素上创建双向数据绑定。input事件触发后将输入框的值与数据进行同步。你可以添加 lazy修饰符，从而转为在change事件之后进行同步。加上 lazy 这样就不用时时同步数据，回车或者光标失去焦点才同步数据。减少消耗，根据需求。框架提供了双向绑定比js原生来实现这种功能太方便了。.lazy: 在默认情况下，v-model在每次。这边输入完值那边就能跟着改变。监听用户输入数据更新。

2024-06-05 11:16:03 103 1

原创前端学习vue：4.事件处理

监听事件，我们可以使用 v-on指令（通常缩写为@符号）来监听DOM事件，并在触发事件时执行一些JavaScript用法为 v-on:click="..."或快捷方式 @click="..."这里的click可以是双击，拖拽.....括号里面hi和what 就是传递去过去的。message就是接收到传递的参数。这里是弹出按钮文字。

2024-06-05 10:33:35 154 1

原创前端学习vue：3.条件渲染和列表渲染

我是孙猴子 </p><p v-if="flag"> 我是孙猴子 </p>使用v-for 指令基于一个数组来渲染一个列表。<p v-if="flag">我是猴子</p><p v-else>你是傻猴子

2024-06-05 10:12:30 268

原创＜七＞前端开发：标签之段落、换行、水平线、图片

相对路径：在同一层级直接写图片名字就行。如果是子级关系就加/斜杠去找。或者../这种去找不同层级的。绝对路径：具体地址，图片不一定在项目里的目录下，但是一定要给清楚具体的位置也能显示出来。可以找个网站打开，然后选择检查，可以多看看别人咋写的。alt 给个默认文本，就是图片如果显示不出来会有这个默认的显示文字。<img>标签定义HTML页面中的图像。可以设置很多属性，颜色，宽度，高度...title鼠标放在图片上时提示的文案。放在标签里方便调整样式结构。src后面给图片的路径名字。

2024-06-05 02:00:33 202

原创＜六＞前端开发：标签之标题

在VSCode编辑器里，直接h1回车或Tab键就会出现成对的h1标签。其他h2~h6也一样。每次运行都要打开.html的话，可以使用插件,VSCode插件，快速打开浏览器。检查打开以后，点击选中调试工具，直接移动上去就可以看用的是标题几的标签。h$*6 然后回车，就会出现h1~h6的标签。拓展->搜索 open in browser ->点击安装。标题是通过<h1></h1> 标签进行定义的。安装完以后就可以右键点击要浏览的文件，然后。会有这两个选项快速打开浏览器去预览。就像文章的标题一样。

2024-06-05 01:17:28 198

原创＜五＞前端笔记：HTML5简介

html></html> 定义HTML文档，这个元素我们浏览器看到后就明白这是一个html文档了。所以你的其它元素要包裹在它里面，标签限定了文档的开始点和结束点。SEO是搜索引擎优化的英文缩写，我们打开百度搜索某个关键字会出现一堆网页，其中靠前的都是SEO优化做的比较好的，除了花钱买的广告。head标签用于定义文档的头部。<head></head>,给浏览器和开发者看的一些信息，不是给用户看的。meta标签用来描述一个HTML网页文档属性。这里的信息都是给用户看的。head必须要包含的。

2024-06-05 00:43:43 151

原创＜四＞前端笔记：VSCode快捷键

Ctrl + Shift + Alt + (Arrow Key) 也是插入多行光标的[方向键控制]Ctrl + Shift + Alt + PgUp/PgDown 也是插入多行光标的[整屏生效]Ctrl + Shift + M 或 Ctrl + J 打开问题展示面板。第一个图标资源管理器。第四个扩展图标，安装插件用。Ctrl + Shift + L 选择所有出现在当前选中的行-操作。Ctrl + Shift + | 匹配花括号的闭合处，跳转。Ctrl + Shift + Tab 切换到最近打开的文件。

2024-06-05 00:03:31 379

m0_59008364的博客