- 博客(51)
- 收藏
- 关注
原创 vue3+ts+案例
组合式 API 征求意见稿 | Vue 组合式 API在线笔记vue3基础Vue3基础综合案例vue3+ts基础知道:什么是字面量类型js 字面量如:18 ‘jack’ [‘a’] {age: 10} 等等。使用 js字面量 作为变量类型,这种类型就是字面量类型。// : 'jack' 是字面量类型 let name : 'jack' = 'jack';// : 18 是字面量类型 let age : 18 = 18;// 报错:不能将类型“19”分配给类型“18” age = 19;
2023-07-18 19:59:53
2118
1
原创 xdisplay报错解决
这个功能也尝试了,不知道最后能成功是不是因为这个的原因windows键+R键打开运行窗口,输入regedit打开注册表,找到以下目录:HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\GraphicsDrivers,右键删除该目录下的Configuration、Connectivity、ScaleFactors文件夹。重启电脑之后将重新生成这三个文件夹,然后再连接外接屏幕即可。
2023-07-05 01:19:54
2242
1
原创 【一】案例练习JavaScript实现随机颜色
将 r 左移 16 位,即将二进制数 r 左移 16 位,得到 0xRR0000,其中 RR 表示 r 的十六进制值。这个值对应颜色值的红色分量。将 g 左移 8 位,即将二进制数 g 左移 8 位,得到 0x00GG00,其中 GG 表示 g 的十六进制值。这个值对应颜色值的绿色分量。这段代码的作用是将 RGB 值转换为十六进制颜色值,并且保证颜色值的字符串长度为 7,即 “#RRGGBB” 的形式。综上所述,这段代码的作用是将 RGB 值转换为一个十六进制颜色值,并且保证颜色值的字符串长度为 7。
2023-03-17 22:02:24
1265
1
原创 浏览器F12调试source中page打开页面为空白
本来想调试js代码,但是发现页面空白,网上也没有找到相关的解决办法。但是还是不明为什么一片空白,后来仔细研究发现。修改后页面就可以正常加载调试了!
2023-03-16 15:06:21
1833
原创 宏任务和微任务JS执行顺序题目+总结
宏任务里如果有宏任务,不会执行里面的那个宏任务,而是被丢进任务队列后面,所以会最后执行。一个宏任务执行完才会去执行另外一个宏任务async函数返回值是promise对象宏任务里如果有宏任务,不会执行里面的那个宏任务,而是被丢进任务队列后面,所以会最后执行。一个宏任务执行完才会去执行另外一个宏任务async函数返回值是promise对象,await后面的代码是异步微任务。
2023-01-06 01:04:23
821
原创 复习【一】
v-model 就是 v-bind 与 v-on 的语法糖。在这里我们将 userInfo 的值给了 value 属性,而 value 属性传递到了 user-add 组件中,所以在 user-add 组件中要通过 props 来接收 value 属性的值。//createElement函数返回的结果为VNode. VNode就是虚拟dom,用js对象来模拟真实的DOM.tag, //标签名称data,// 传递数据children //子节点数组)}路由是一个比较广义和抽象的概念,
2022-09-27 20:53:38
653
原创 HTML+CSS+JS
答:它可以减少请求多张小图片带来的网络消耗(因为发起的HTTP请求数变少 了),并实现提前加载资源的效果。var声明的变量会导致变量声明提升。
2022-09-26 13:40:09
862
原创 【三】事件修饰符Vue-Cli配置跨域代理封装接口vuex状态管理
我们这里生产环境和开发环境设置了不同的值,后续我们还会在生产环境部署的时候,去配置该值所对应的反向代理,反向代理指向哪个地址,完全由我们自己决定,不会和开发环境冲突。同时,还需要注意的是,我们同时需要注释掉 mock的加载,因为mock-server会导致代理服务的异常。从上图可以看出,开发环境实际上就是在自己的本地开发或者要求不那么高的环境,但是一旦进入生产,就是。,我们需要让vuex来介入,将用户的token状态共享,更方便的读取,如图。借助代理解决前端与后端的跨域问题,后端与后端之间没有跨域问题。..
2022-08-09 12:45:53
193
原创 npm WARN deprecated core-js@3.6.5: core-js@<3.23.3 is no longer maintained and not recommended for u
原文链接:https://blog.csdn.net/xin_666/article/details/123508389。当前core-js@2已经放弃维护了,所以要装3以上的版本。目前我用的是3.19.1。3、最后再 npm install 或者 yarn install。1、先删除 node_modules 依赖。4、最后 npm run dev 运行启动。我启动的时候出现的问题为。2、首先安装 报错的插件。...
2022-08-06 17:57:38
8412
原创 总结一Ajax异步复习vuex购物车案例
在前端通过HTTP协议向服务器发送请求时,要等待服务器的回应才能做下一步的操作,这给与了用户很不好的体验感。ajax是前端异步请求后台数据的技术,能做到在前端不刷新网页的情况下,获取后台数据在前端做显示,能给与用户很好的体验感。不建议,vuex要求我们在mutations里面修改state状态(这样可以在调试工具里面追踪变化过程)--------负责修改state里的数据。mutations只能写什么样的代码?--------同步流程的代码。mutations的是state,actions的是store。.
2022-08-05 11:03:56
299
原创 [Vue warn]: Property or method “$store“ is not defined on the instance but referenced during render.
Vue warn]:属性或方法“$store”未在实例上定义,但在渲染期间引用。通过初始化该属性,确保该属性在数据选项中或在基于类的组件中是反应性的。因为vuex下载 默认是vuex4版本 下载vuex3版本即可。...
2022-08-04 13:06:23
1291
原创 Error in directive fofo inserted hook: “TypeError: Cannot read properties of null (reading ‘focus‘)
本身已经是textarea了不能再获取input了,所以获取了空。
2022-07-26 11:59:57
3765
原创 Error in created hook (Promise/async): “TypeError: (0 , _api__WEBPACK_IMPORT
没有引入问题的错误,不是默认导出记得加大括号这个错误,后来发现是。大家一定要注意不要拼错名字要复制粘贴才行!文章详情里面少加了一个s。大家一定要复制粘贴才行。
2022-07-26 10:44:45
5905
原创 heima头条项目【一】
Babel 把js语法进行翻译降级TypeSCript 基于JavaScript封装的一个超类,js是弱类型语言,ts是强类型语言PWA脱机应用Router路由后面两个是测试用需要的这种一般是Eslint错误规范文档:🔗规范文档2:🔗规范文档3:🔗ESLint在哪里生效? webpack开发服务器+ESLint配置检查4.Git配置二、统一管理请求的接口1.封装axios函数之前的方法jquery中文文档🔗解决方案:一摸一样的控制面板、高级的设置模式以后换库, 只...
2022-07-13 12:37:58
747
原创 heima头条案例-Vuex接口220708可用
Vuex是Vue生态体系中主流的状态管理工具,类似于Redux。它有三个最最核心的概念:state,用来存储数据的,数据类型是对象;mutation,修改state,只能通过mutation,只能执行同步代码;action,执行异步代码,提交数据给mutation;...
2022-07-11 15:33:49
3769
6
原创 Vuex基础【一】
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用存储管理应用的所有组件的状态,并以相应的规则保证状态以一种的方式发生变化。结论初始化:vuex基础-statestate是放置所有公共状态的属性,如果你有一个公共状态数据 , 你只需要定义在 state对象中如何在组件中获取count?1.原始形式- 插值表达式组件中可以使用 this.$store 获取到vuex中的,可通过state属性属性获取count, 如下2.计算属性- 将state属性定义在计算属性中
2022-07-08 15:01:11
3078
原创 “export ‘default‘ (imported as ‘VueRouter‘) was not found in ‘vue-router‘
出现警告:"export ‘default’ (imported as ‘VueRouter’) was not found in ‘vue-router’"export ‘default’ (imported as ‘Vue’) was not found in ‘vuer’原因是cli4和cli3不太一样,我这里是 vue-router版本太高,安装旧版本命令:yarn add vue-router@+版本号...
2022-07-05 10:39:17
954
原创 路由_vant组件库基础使用
2022_0704映射关系具体使用示例: 网易云音乐 https://music.163.com/单页面应用(SPA): 所有功能在一个html页面上实现前端路由作用: 实现业务场景切换优点:整体不刷新页面,用户体验更好数据传递容易, 开发效率高缺点:开发成本高(需要学习专门知识)首次加载会比较慢一点。不利于seo官网: https://router.vuejs.org/zh/vue-router模块包它和 Vue.js 深度集成可以定义 - 视图表(映射规则)模块化的提供2个内置全局组件声明式导航自动激
2022-07-04 16:23:47
1123
原创 动态组件 插槽-案例-tabbar
E:\前端学习\7.6课件\02、课件和试卷\课件\05、阶段五 Vue.js项目实战开发\01webpack+Vue基础课程资料\Day06_动态组件_插槽_自定义指令_tabbar案例\01_笔记和ppt1.什么是动态组件?在同一个挂载点, 可以切换显示不同组件2.如何使用动态组件?vue内置的component组件, 配合is属性3.如何切换?改变is属性的值, 为要显示的组件名即可使用Vue内置的keep-alive组件, 可以让包裹的组件保存在内存中不被销毁补充2个钩子方法名: acti
2022-07-04 09:32:38
262
原创 知识点扩展【一】有购物车案例多练习v-model双向绑定
1、axios是一个基于Promise的HTTP库,而ajax是对原生XHR的封装;2、ajax技术实现了局部数据的刷新,而axios实现了对ajax的封装。🔗axios和ajax的区别用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中。🔗扩展运算符生命周期&数据共享[父子-子父-兄弟]&ref引用&数组复习获取页面中的元素可以使用以下几种方式:🔗Dom 获取元素的几种方式组件的 $nextTick(cb) 方法,会把 cb 回调推迟到下一个 DOM 更新周期之后执行。通俗的理解是...
2022-07-01 16:50:17
187
原创 vue基础二
马上能反应过来循环遍历是什么, 索引(下角标)是什么 数组的filter方法使用 重绘与回流(重排)的概念 localStorage浏览器本地存储语法使用 JSON的方法使用今日学习目标能够了解key作用, 虚拟DOM, diff算法能够掌握设置动态样式能够掌握过滤器, 计算属性, 侦听器能够完成品牌管理案例1. vue基础1.0_vue基础 v-for更新监测情况1: 数组翻转情况2: 数组截取情况3: 更新值口诀:数组变更方法, 就会导致v-fo
2022-06-24 21:16:50
960
原创 VueVue-cli
vue文件代码高亮插件-vscode中安装 代码提示插件-vscode中安装 想学会今天的内容, 先测测这几个会不会如果通不过, 请记住口诀:变量是一个容器, 表达式原地都有返回结果new 类名() - 原地得到一个实例对象 - 对象身上有key(或叫属性, 叫键都行), 对应的值是我们要使用的实例化对象就是new 类名() 创造出来的对象, 身上包含属性(key, 键) 对应的 值什么是属性和方法(固定格式)对象的复制和取值(固定格式)有=(赋值运算符) 就是赋值, 没有就是取值thi
2022-06-23 02:50:25
899
原创 webpack压缩合并解决兼容性问题
之前用npm学习的webpack打包:🔗打开快速、可靠、安全的依赖管理工具。和 npm 类似, 都是包管理工具, 可以用于下载包, 就是比npm快🔗中文地址下载地址: https://yarn.bootcss.com/docs/install/#windows-stablewindows - 软件包(在笔记文件夹里)mac - 通过homebrew安装(看上面地址里)mac如果没安装过homeBrew先运行这个命令上面命令不行: 试试这个: curl -o- -L https://yarn..
2022-06-20 22:39:04
1008
原创 黑马头条案例
3.安装和配置Vant组件库写在前面:一些血泪总结,不要动eslint配置特别是写驼峰命名时候,你就写驼峰命名,文件改删除的删除一个也不要留也不要重命名,index.js路由配置一定要改!!!写之前把原来的删除掉!!!!🔗 vant组件库🔗适用于vue2在安装组件的时候出现以下问题,npm版本问题报错解决方法:在命令后面加上方法一、自动按需引入组件 但是相当麻烦 所以用方案三Vant 支持一次性导入所有组件,引入所有组件会增加代码包体积,因此不推荐这种做法。发布时候会有优化。4.使用Tabbar..
2022-06-15 04:07:17
2642
原创 后台案例学习路由
2.基于路由渲染登陆组件页面展示:又要用到大事件项目bearer翻译过来是持票人的意思,所以bearer token可以形象地理解为临时的入场票据index.js配置路由规则点击侧边栏展示出对应的组件------嵌套路由MyAside.vueMyHome.vue路由规则是平级的,因为它在一个页面展示,所以规则平级prevent阻止默认行为,阻止a链接跳转只挑地址还不行,还要传递参数所以加上id1.r是,可以认为是,包含了。2.,都会有一个,,可以获取对应的name,pa
2022-06-14 01:14:19
185
原创 优化axios&路由
之前的组件每一次都需要导入,每一个.vue都相当于vue实例这样做在子组件中可以去掉导入,通过组件实例原型axios发起请求这样写更规范!!!今后,在每个.vue组件中要发起请求,直接调用this.$http.xxx但是没有解决请求根路径问题,不利于后期维护。在原型挂载之前添加以下代码,全局配置axios请求根路径4.直接把axios挂载到vue原型上的缺点缺点:无法实现api接口的复用路由(英文:router)就是对应关系。SPA (单页面应用程序)指的是一个 web 网站只有唯一的一个
2022-06-13 11:22:59
767
原创 ESLint安装配置
1.eslint–weiruan2.prettier-code formatter3.路径下找不到.prettierrc,自己配置一个里面写,"C:\Users\自己用户名.prettierrc"新建一个.prettierrc文件,写入如下内容
2022-06-12 20:44:19
239
原创 动态组件 & 插槽 & 自定义指令
动态组件指的是vue 提供了一个内置的,专门用来。可以认为,给组件占位,它的is属性指定哪个组件的名称,就把哪个组件渲染到它所在的位置。默认情况下,切换动态组件时无法保持组件的状态,会被销毁,此时可以使用 vue 内置的 保持动态组件的状态。示例代码如下:当组件时,会自动触发组件的 生命周期函数。当组件时,会自动触发组件的 生命周期函数。当组件第一次被创建的时候,既会执行created生命周期(先),又会执行activated生命周期(后)。但组件被激活的时候只会触发activ......
2022-06-12 11:19:05
403
原创 黑马vue2案例购物车220612接口可用
2.基于axios请求列表数据当前终端被占用,新建一个终端输入如下指令,完成后删除这个终端🔗axios是一个专注于网络请求的库安装并导入axios请求库在methods方法中,定义getList函数请求列表数据在created生命周期函数内调用步骤2封装的getList函数3.请求回来的数据转存到data中data里面----- list:[]if (res.status === 200) this.list = res.list;在vue调试控制台可以看见list4.
2022-06-12 07:19:35
2410
5
原创 生命周期&数据共享[父子-子父-兄弟]&ref引用&数组复习
生命周期(Life Cycle)是指一个组件从创建 -> 运行 -> 销毁的整个阶段,强调的是一个时间段。生命周期函数:是由 vue 框架提供的,会伴随着组件的生命周期,。注意:强调的是,强调的是组件创建之前->组件创建好(内存中)->组件渲染之前->组件渲染到浏览器页面上组件更新前->组件更新后组件销毁前->组件销毁后可以参考 vue 官方文档给出的“生命周期图示”,进一步理解组件生命周期执行的过程:🔗 生命周期图示webpack从main.js开始执行,遇到App根组件,vue-tamplate-.
2022-06-11 22:44:36
477
原创 超级简单用鼠标右键添加“以VSCode打开”选项
网上很多教程都是采用如下方法:看到一个简单的方法3.找自己的位置和我一样笨办法,把这个复制的地址放到新建的文本文档里面,替换地址内容即可将代码中的 E:\Microsoft VS Code\Code.exe 替换为本机的VS Code安装路径OKKK!!!...
2022-06-10 01:49:08
267
原创 axios 是一个专注于网络请求的库
axios 是一个专注于网络请求的库!只负责发请求和拿数据在后面的vue react都会用axios来请求数据
2022-06-09 13:38:49
222
原创 Vue基础入门
vue是一套用于的前端。数据驱动视图:双向数据绑定:当数据源发生变化时,会被 ViewModel 监听到,VM 会根据最新的数据源自动更新页面的结构当表单元素的值发生变化时,也会被 VM 监听到,VM 会把变化过后最新的值自动同步到 Model 数据源中vue官网:https://v3.cn.vuejs.org/guide/introduction.htmlvue 指令1. 内容渲染指令 指令的缺点:会覆盖元素内部原有的内容! 插值表达式:在实际开发中用的最多,只是内容的占位符,不会覆盖原有的内容
2022-06-09 05:10:03
185
原创 前端工程化与webpack入门教程
1.实际的前端开发:⚫ 模块化(js 的模块化、css 的模块化、资源的模块化)⚫ 组件化(复用现有的 UI 结构、样式、行为)⚫ 规范化(目录结构的划分、编码规范化、接口规范化、文档规范化、 Git 分支管理)⚫ 自动化(自动化构建、自动部署、自动化测试)2.什么是前端工程化前端工程化指的是:在企业级的前端项目开发中,把前端开发所需的工具、技术、流程、经验等进行。企业中的 Vue 项目和 React 项目,都是基于工程化的方式进行开发的。好处:前端开发自成体系,有一套标准的开发方案和流程3.
2022-06-08 15:03:40
83
原创 node.js_express_nodemon路由中间件CORS【三】
Express创建基本的web服务器、nodemon、路由、中间件、跨域访问使用cors中间件解决跨域访问问题
2022-06-07 01:11:35
1103
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人