![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
大前端开发
m0_59008364
这个作者很懒,什么都没留下…
展开
-
vue实战商城后台管理系统:开篇<一>
左边是一列导航,上面是一个可以动态隐藏进去的按钮,右边就是退出登录一些操作。大概看下 要实现的页面长的样子 有什么功能。表格多选,删除,增删改查啥的。原创 2024-06-08 19:34:07 · 139 阅读 · 0 评论 -
前端学习笔记:节流
例如百度输入框 每输入一次就刷新一次,因为人家服务器大。主要就是实现 间隔一段时间让它搜索一次,而不是一直搜索。节流和防抖一样,如果放任不管的话也容易引起浏览器卡死。用户按住滚动条不停的滚动,原创 2024-06-08 18:24:25 · 201 阅读 · 0 评论 -
前端学习笔记:防抖(debounce)
例如双十一,购买某个物品很多人在一直点按钮,会对服务器造成压力,每点一次向服务器发送一次请求。防抖问题如果放任不管的话 容易引起浏览器卡死。利用定时器来实现,在某个时间段内只能执行一次。原创 2024-06-08 17:46:00 · 165 阅读 · 0 评论 -
前端学习vue:vue3新特性2
因为生命周期函数使用率比较高,所以这块里面的代码也比较多,太多的话就会乱。一个函数放一个业务一个函数放一个业务加上注释 会更加清晰一些。Provide/Inject. 2.0也有 只不过使用率低,现在3.0做了增强。需要两个参数第一个是key,上面的例子就是 customVal,第二个传递的值。生命周期比以前有优势,以前同一个生命周期函数只能存在一个,现在可以存在多个。引入 import { provide } from "vue"只能父组件向子组件传递。原创 2024-06-08 17:28:08 · 122 阅读 · 0 评论 -
前端学习vue:vue3新特性1
import {ref,reactive} from "vue" 需要哪个知识点引入哪个就会以上面优点里提到的,剪辑 效果引入进来。3.0 无法使用和2.0一样的this 但是可以通过接收 setup(props,ctx)的方法 获取当前组件的实例和props.。之前我们在<template>标签里显示的数据,都是在data里定义好的,(开发者用的多一些)。先导入:import {ref,reactive} from "vue"ref 基本类型使用比较高,reactive 复杂类型使用比较高。原创 2024-06-08 17:10:05 · 234 阅读 · 1 评论 -
前端学习vue:13.嵌套路由配置
路由嵌套,在路由配置文件里配置children。属于谁的就在谁下面加。这种二级导航,点击对应的显示对应的菜单和再点击菜单选项显示对应内容。redirect 重定向。原创 2024-06-08 10:11:36 · 94 阅读 · 0 评论 -
前端学习:DOM之Document对象_方法_获取元素
获取的内容是多个的话 可以通过索引来获取指定的。也可以获取 id ...根据需求查看API。通过这些方法获取节点及内容进行需求开发。原创 2024-06-07 22:56:05 · 180 阅读 · 0 评论 -
前端学习:DOM概述
DOM是javascript操作网页的接口。全称为“文档对象模型”(Document Object Model)。它的作用是将网页转为一个JavaScript对象,从而可以用脚本进行各种操作(比如对元素增删内容)。DOM 是 JS 来操作网页的接口(变化)。原创 2024-06-07 22:49:43 · 189 阅读 · 0 评论 -
<十>前端开发:列表标签之有序和无序列表
标签。有序列表是一列项目,列表项目使用数字进行标记。百战程序员尚学堂原创 2024-06-07 22:36:26 · 155 阅读 · 0 评论 -
<九>前端开发:标签之文本
白菜原创 2024-06-07 22:26:52 · 94 阅读 · 0 评论 -
<八>前端开发:标签之超文本链接
比如我们打开某一个网页,里面布满各种各样的超文本链接,一点击都会跳转到别的页面。使用href 属性 赋值一个跳转链接 就可以完成跳转。文本 、 图片、词 句子 都可以实现跳转。想跳转哪里跳转哪里,利用超文本链接实现。使用原创 2024-06-07 22:22:44 · 185 阅读 · 0 评论 -
前端学习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 · 170 阅读 · 0 评论 -
前端学习vue:11.Axios网络请求跨域解决方案
的 Ajax 请求,那么这个请求是同域的,因为资源路径的协议、域名以及端口号与当前域一致(例子中协议名默认为http,端口号默认为80)。需要注意的是,配置完成以后,需要重新运行 npm run serve 才可以生效。我们认为如果 “协议 + 域名 + 端口号” 均相同,那么就是同域。不是每个网络请求和每个接口都能拿到数据,JS采取的是同源策略。的 Ajax 请求,因为请求域 http://不同,那么这个请求就是跨域请求。的网站,它发起一个资源路径为。和发起请求的域 http://原创 2024-06-06 05:46:13 · 145 阅读 · 0 评论 -
前端学习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 · 900 阅读 · 0 评论 -
前端学习vue:9.组件的生命周期
例如:需要设置数据监听、编译模板、将实例挂载到DOM并在数据变化时更新DOM等。渲染时: beforeMount、mounted(用的比较多)更新(数据变化)时: beforeUpdate、updated。卸载时:beforeUnmount、unmounted。创建时: beforeCreate、created。卸载之前的函数里可以放把消耗性能的处理都干掉,比如定时器....的函数,这给了用户在不同阶段添加自己的代码的机会。创建完以后还没渲染,然后渲染前到渲染。然后在 卸载前到卸载。不同节点做不同时期。原创 2024-06-06 04:03:46 · 173 阅读 · 0 评论 -
前端学习vue:8.Props组件交互
Prop类型,传递参数没有类型限制,字符串、数组、对象 ...都可以。组件与组件之间是需要存在交互的,否则完全没关系,组件的意义就很小了。Prop是你可以在组件上注册的一些自定义 attribute。<h3>prop传递数据</h3>传递数量也没有限制。原创 2024-06-06 03:45:52 · 114 阅读 · 0 评论 -
前端学习vue:6.组件基础
vue是组件化开发,单文件组件,后缀名为.vue结束。i组件单独独立,某个不能用了不会影响其他组件,修改也可以进行单独修改。一个文件存在三个部分。(html+js+css)通常一个应用会以一棵嵌套的组件树的形式来组织。原创 2024-06-05 14:23:23 · 167 阅读 · 0 评论 -
前端学习vue:5.表单输入绑定
你可以用 v-model 指令在表单 <input>、<textarea>及<select>元素上创建双向数据绑定。input事件触发后将输入框的值与数据进行同步。你可以添加 lazy修饰符,从而转为在change事件之后进行同步。加上 lazy 这样就不用时时同步数据,回车或者光标失去焦点才同步数据。减少消耗,根据需求。框架提供了双向绑定 比js原生来实现这种功能太方便了。.lazy: 在默认情况下,v-model在每次。这边输入完值那边就能跟着改变。监听用户输入数据更新。原创 2024-06-05 11:16:03 · 96 阅读 · 1 评论 -
前端学习vue:4.事件处理
监听事件,我们可以使用 v-on指令(通常缩写为@符号)来监听DOM事件,并在触发事件时执行一些JavaScript用法为 v-on:click="..."或快捷方式 @click="..."这里的click可以是双击,拖拽.....括号里面hi和what 就是传递去过去的。message就是接收到传递的参数。这里是弹出按钮文字。原创 2024-06-05 10:33:35 · 147 阅读 · 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 · 260 阅读 · 0 评论 -
<七>前端开发:标签之段落、换行、水平线、图片
相对路径: 在同一层级 直接写图片名字就行。如果是子级关系就加/斜杠去找。或者../这种去找不同层级的。绝对路径:具体地址,图片不一定在项目里的目录下,但是一定要给清楚具体的位置也能显示出来。可以找个网站打开,然后选择检查,可以多看看别人咋写的。alt 给个默认文本,就是图片如果显示不出来会有这个默认的显示文字。<img>标签定义HTML页面中的图像。可以设置很多属性,颜色,宽度,高度...title鼠标放在图片上时 提示的文案。放在标签里方便调整样式结构。src后面给图片的路径名字。原创 2024-06-05 02:00:33 · 194 阅读 · 0 评论 -
<六>前端开发:标签之标题
在VSCode编辑器里,直接h1回车或Tab键就会出现成对的h1标签。其他h2~h6也一样。每次运行都要打开.html的话,可以使用插件,VSCode插件,快速打开浏览器。检查打开以后,点击选中调试工具,直接移动上去就可以看用的是标题几的标签。h$*6 然后回车,就会出现h1~h6的标签。拓展->搜索 open in browser ->点击安装。标题是通过<h1></h1> 标签进行定义的。安装完以后就可以右键点击要浏览的文件,然后。会有这两个选项快速打开浏览器去预览。就像文章的标题一样。原创 2024-06-05 01:17:28 · 181 阅读 · 0 评论 -
<五>前端笔记:HTML5简介
html></html> 定义HTML文档,这个元素我们浏览器看到后就明白这是一个html文档了。所以你的其它元素要包裹在它里面,标签限定了文档的开始点和结束点。SEO是搜索引擎优化的英文缩写,我们打开百度搜索某个关键字会出现一堆网页,其中靠前的都是SEO优化做的比较好的,除了花钱买的广告。head标签用于定义文档的头部。<head></head>,给浏览器和开发者看的一些信息,不是给用户看的。meta标签用来描述一个HTML网页文档属性。这里的信息都是给用户看的。head必须要包含的。原创 2024-06-05 00:43:43 · 146 阅读 · 0 评论 -
<四>前端笔记: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 · 365 阅读 · 0 评论 -
前端学习vue:2.模板语法
要学会多看文档:cn.vuejs.org有时间了可以把官方文档都没事看一遍,预览预览。在 vscode里打开创建的vue-demo,npm run serve 运行在浏览器看效果。然后先来看一下左边的目录:src下的components 里有个 HelloWorld.vue 文件,要写代码的地方。目录下 assets 放静态资源,公共css文件,图片资源。App.vue 根组件,所有组件从这里引入显示。main.js 所有程序的入口。看下面的代码:原创 2024-06-04 23:14:19 · 1004 阅读 · 0 评论 -
前端学习Nodejs环境安装
有的浏览器没法支持ES6新特性, 还是支持ES5 所以要进行转码支持,Node JS环境就可以进行支持。所以我们要安装这个环境。NodeJs诞生于2009年,主攻服务器方向,使得利用JavaScript也可以完成服务器代码的编写。到现在发展也十来年时间了,也比较成熟了,有的公司也用这个来编写。Nodejs安装,官网:https://nodejs.org/en/下载完直接下一步傻瓜式安装就行。全用默认。用c盘就行,不是大很,不要改路径防止出现别的问题。原创 2024-06-04 05:14:48 · 280 阅读 · 0 评论 -
前端学习笔记ECMAScript6简介
ECMAScript和JavaScript的关系。这俩是一个东西,前者是后者的规格规范,后者是前者的一种实现,这两个词是可以互换的。只不过一般不说JS6而是说ES6.ES6是javascript语言的标准,2015年6月份发布。它的目标是使得js语言可以编写复杂的大型应用程序,成为企业级开发语言。ES6是一个统称,包含 ES7(2016)、ES8(2017)、.....后续版本都在ES6里有讲,这不过是一种统称。任何人都可以向标准委员会(又称TC39委员会)提案,要求修改语言标准。原创 2024-06-04 04:49:14 · 126 阅读 · 0 评论 -
前端学习笔记ES6之命令行工具
常用的命令行工具有两种:CMD命令行工具。PowerShell命令行工具。(功能要比CMD要方便很多,操作方便)但是前端用的命令行都是很基本的 所以这两种没啥太大差异。原创 2024-06-04 04:26:18 · 165 阅读 · 0 评论 -
前端学习笔记Vue:1.Vue简介与开发前准备
Vue是什么?渐进式JavaScript框架。易用、灵活、高效。前端优秀的框架。用于构建用户页面。渐进式框架。为什么学习它?应用场景比较多,很多项目用它来实现。企业用它(企业用它就可以凭借这个技术点进入企业打工挣钱)。它比较火为什么比较学,简单易学。提升开发体验。招聘需求都会有这个技术栈的要求需求。学习难度较低。(前端三大框架相对来说最低)大厂用React多一些。社区比较繁荣。.......Vue开发前端的准备。Vue中文官:cn.vuejs.org。原创 2024-06-04 04:18:18 · 196 阅读 · 0 评论 -
<三>前端学习笔记 工具选择与安装
VSCode 默认安装完是英文的,要是想看中文的菜单或提示的话,打开VSCode然后可以选择 扩展(最下面四个方块的图标)->搜索Chinese->点击安装。VSCode (推荐使用,对电脑配置要求也不是很高,打开速度快,使用方便)(国内开发的工具,中文的。开发者工具有效的提高了开发效率。百度广告 附带软件 乱七八糟太多,可以用必应去搜索相关软件下载。1.简洁大方,打开响应速度快。安装完后重启下,再次打开就是中文的了。工具选择2: 开发者工具。工欲善其事必先利其器.工具选择1: 浏览器。原创 2024-06-04 03:39:27 · 126 阅读 · 0 评论 -
<二>前端学习笔记:第一个前端程序
我的网页Hello,我的第一个网页原创 2024-06-04 03:15:38 · 189 阅读 · 0 评论 -
<一>前端学习笔记1行业前景和学习方法
岗位:职位相对于其他职位非常的多。大城市小城市都有。职位也都是最近发布的。薪资待遇:正常开发者: 1万-3万。(学的好 背景好更多)。学习方法:守: 学习期间,照老师的做,不急功近利,不做创新!不怀疑老师。破:工作后,开始突破,怀疑老师,构建自己的知识体系。离:工作3年后形成自身体系,彻底脱离老师,自成一家。个人感悟与提问:学技术到底是为了什么?原创 2024-06-04 03:01:19 · 287 阅读 · 0 评论