自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(27)
  • 资源 (1)
  • 收藏
  • 关注

原创 Vue3(框架setup)手挫滚动某距离固定导航

精选

2023-07-06 10:11:49 248

原创 Vue3列举一下封装组件的实列

import http from './request'export const login=(params)=>http.post('/login',params)

2023-07-03 17:43:34 126

原创 Vue3封装的请求拦截

baseURL: 'http://127.0.0.1:8888/api/private/v1/', //工作时把地址替换后端的地址。// 在请求发送之前, 开启加载服务, 显示加载框, target指定显示加载的元素。// 处理完响应数据后, 把响应数据中的data字段提出来, 返回继续执行响应。// 给请求对象添加请求头,把token加入请求头, 执行登录认证。timeout: 3000, //工作时把端口号替换后端给的端口号。// 处理完请求数据后, 返回继续发送请求。// 请求完成时, 关闭加载框。

2023-07-03 17:40:30 287

原创 路由的跳转与传值

tabbar跳转</navigator><navigator url="/pages/index/index" open-type="reLaunch">任意跳转

2023-06-20 17:41:55 123

原创 小程序的功能总结

2, 调用API wx.showShareMenu({menus: []}) 开启分享功能,可设置分享好友还是分享朋友圈 shareAppMessage指微信好友分享 shareTimeline 指的是微信朋友圈分享 ,, 点击右上角菜单分享。1, 在js文件中实现onShareAppMessage函数,即可点击右上角菜单分享给微信好友 (页面中默认已实现)在js文件中实现onShareTimeline函数,即可点击右上角菜单分享到微信朋友圈 (需要自己添加)

2023-06-20 17:35:13 72

原创 Vite的使用说明

---------- 使用create-vue搭框架(可选router和pinia) ------------------------- 使用vite搭框架(没有router和pinia) -------------------------- 组件库element-plus ---------------------- 预处理器 Sass ---------------------- 配路由 ------------------------- 配代理 -------------

2023-06-12 17:41:20 192

原创 vue项目打包的步骤和详细word文件

1, 把项目中所有的跨域代理请求的代理地址,改成跨域原地址(如果有在线字体图标, 图标引入地址@font-face中的url前加http)2, 在vue.config.js中,修改公共路径 publicPath : './'3, vue2:在路由文件/src/router/index.js 中把路由历史模式注释掉 // mode: 'history' 或改成默认的 hash 模式。

2023-06-12 15:21:15 133

原创 新手谈大屏可视化的适配方案

大屏可视化一般是用于大屏展示, 而不同的大屏设备分辨率和宽高比不太一样, 所以同一个网页需要在不同的大屏上完美展示, 就需要做大屏适配 , 大屏适配有以下两种解决方案。2, 按照UI设计稿的原始尺寸(1920*1080) ,使用px为单位实现固定尺寸的图表, 适配时,使网页缩放以占满整个屏幕。1, 图表的尺寸和位置统一使用vw, vh做单位, 宽度都用vw单位, 高度都用vh单位。用法: 适用于缩放比例不大,微调的大屏,原始比例和大屏比例差别不大的情况下。好处:排版灵活,不会出现图标拉伸。

2023-06-12 15:17:25 387

原创 Vue3图片懒加载

3, 组件中显示图片时,使用懒加载, 将图片的:src改为v-lazy即可。2, 在main.js入口文件中引入图片懒加载模块。1, 安装图片懒加载模块。

2023-06-08 17:28:49 835

原创 Vue3单文件组件语法糖

语法糖: 语法糖(Syntactic sugar),也译为糖衣语法,是由英国计算机科学家彼得·约翰·兰达(Peter J. Landin)发明的一个术语,指计算机语言中添加的某种语法,这种语法对语言的功能并没有影响,但是更方便程序员使用。// 使用defineProps自定义属性,接收父组件传值, 新版本无需导入,直接用。// 从路由模块中导入路由组合式API函数, 调用函数即可获取路由数据。4, 在setup/语法糖中使用组件路由守卫。//在setup/语法糖中调用路由守卫。

2023-06-08 17:28:15 718

原创 My Sql 新手必掌握的语法

select name,age from 表名 where phone='1506065500' and age=25。select name,age from 表名 where phone='15060655' or age=25。select * from 表名 where name like '李%''_a_' //三位且中间字母是a的。'a_' //两位且开头字母是a的。'%a' //以a结尾的数据。'a%' //以a开头的数据。'%a%' //含有a的数据。

2023-06-01 12:31:52 694

原创 新手修改第三方组件的样式问题方案

* ::v-deep() vue3新增 css/less/sass通用样式穿透 *//* :deep() vue3新增 css/less/sass通用样式穿透 *//* ::v-deep css/less/sass通用样式穿透 *//* /deep/ css/less/sass通用样式穿透 */父组件选择器 >>> 子组件选择器 { 子组件样式 }::v-deep 子组件选择器 { 子组件样式 }::v-deep(子组件选择器){ 子组件样式 }/deep/ 子组件选择器 { 子组件样式 }

2023-05-30 17:33:39 307

原创 新手使用组件库——Vant

官网:https://vant-contrib.gitee.io/vant/v2/#/zh-CN/移动端组件库参考: https://www.jianshu.com/p/c3c671787d1d。在根目录的babel.config.js文件中添加plugins字段。最后, 在组件中直接复制官方文档中的组件代码即可显示。然后在组件中直接复制官方文档中的组件代码即可显示。导入所有组件: 在main.js中添加如下代码即可。在mian.js中按需导入需要用到的组件。按需导入组件(推荐)

2023-05-30 17:31:54 170

原创 新手谈Less

2:使用Vscode 安装 Easy less 插件 写好less文件之后 ctrl +s 保存 就可以直接编译成css 文件 然后在html文件中引入即可。缺点:这种方式是在客户端把less文件编译成css文件,如果less文件体量比较大,会影响页面渲染速度。3.1全局安装 less npm i less -g。1:直接引入less文件,再引入js文件把less编译成css。官网:https://lesscss.com.cn/官网:https://www.sass.hk/

2023-05-30 17:30:00 70

原创 新手使用组件库——Element

PC端组件库参考: https://www.jianshu.com/p/669d3e41dca6。element 官网 https://element.eleme.cn/#/zh-CN。在balbel.config.js文件中添加plugins字段。下载安装插件 babel-plugin-component。完整引入: 在main.js文件中引入如下三句代码。在main.js中按需导入需要的组件。在组件中直接使用组件标签即可。注意: 有几个特殊的使用如下。1, 下载安装组件库。

2023-05-30 17:29:41 455

原创 新手谈Vuex的入门-入门

4, 在main.js中导入store/index.js状态管理仓库, 帮把它添加到vue根组件中。2, 在/src目录下新建文件 /src/store/index.js 导入vuex。-- state在映射到计算属性中之后,当作计算属性来用 -->-- state在映射到计算属性中之后,当作计算属性来用 -->3, 在/src/store/index.js中创建管理仓库, 并导出。// 使用映射函数把状态数据state映射到计算属性中。// 使用映射函数把状态数据state映射到计算属性中。

2023-05-30 17:29:21 74

原创 新手谈一谈路由守卫

beforeRouteEnter, beforeEnter, beforeEach, 这三个都是路由进入之前的守卫, 这些路由守卫常用于做登录认证, 在这里判断用户是否已经登录, 如果已经登录,调用next()允许进入, 如果没有登录, 不调用next(),禁止进入 主要针对一些需要登录状态才能访问的页面, 如: 个人信息页。路由守卫也叫路由钩子函数, 它是在路由跳转过程中调用的函数, 通过路由守卫可获取路由信息和阻止路由跳转。路由守卫的参数有三个: to, from , next。

2023-05-27 14:21:38 133

原创 新手推荐好用的懒加载模块的使用书(vue2!)

3, 组件中显示图片时,使用懒加载, 将图片的:src改为v-lazy即可。2, 在main.js入口文件中引入图片懒加载模块。(安装最新版的会报错 安装指定版本)1, 安装图片懒加载模块。

2023-05-27 14:19:09 400 2

原创 新手在Vue中使用axios说明书

3, 在任意组件中使用axios(添加$用于和组件内字段区分)2, 在组件的script标签中导入axios。2, 在main.js中导入并设置Vue原型。1, 在vue项目中下载安装axios模块。1, 在vue项目中下载安装axios模块。3, 在当前组件的函数发起ajax请求。局部使用(在某一个组件中用)全局使用(在任意组件中用)

2023-05-26 10:46:26 139 1

原创 Vue的配置代理

此文件基于vue脚手架5.0实现, 把以下代码替换项目中vue.config.js的内容, 修改代理target即可。// 在vue.config.js中的devServer.proxy字段设置代理服务器。// 这个文件是服务器的配置文件, 所以这个文件的修改需要重启项目生效。lintOnSave: true, // 在保存时校验格式。publicPath: '/', // 启动页地址。outputDir: 'dist', // 打包的目录。服务端设置的一些功能。

2023-05-26 10:44:07 462 1

原创 Vue脚手架主流版本介绍

参考文档: https://www.cnblogs.com/wisewrong/p/9740173.html。在vue/cli5.x之后, 项目搭建时,vue.config.js会自动创建, 结构如下。以上是vue/cli 3.x/4.x的写法, 手动创建vue.config.js。host: 'localhost', // 主页地址。publicPath:'/', // 启动页地址。outputDir: 'dist', // 打包的目录。publicPath: '/', // 启动页地址。

2023-05-25 14:35:06 646 2

原创 前端脚手架介绍

Vue CLI是一个官方发布 vue.js 项目脚手架。vue语法版本: 1.x 废除 2.x 之前的主流,大部分老项目都在用 3.x 21年上半年正式发布,大部分新项目在用。使用上, 脚手架就是一个nodejs模块, 使用npm下载安装后结合webpack打包工具可快速生成一个vue项目架构。vue脚手架版本: 1.x/2.x 以前老的项目使用的版本 3.x/4.x/5.x目前主流版本。代码中, 一个网站,app项目也要使用脚手架进行搭建, 使用脚手架可以快速搭建一个vue项目。

2023-05-25 14:34:28 226 1

原创 新手的新建服务器的步骤

3.安装 express (Express 基于 Node.js 平台,快速、开放、极简的 Web 开发框架)1.1npm init 之后 可以直接敲回车(注意名字)4.在入口文件里面引入express 编写服务器代码。

2023-05-25 10:45:08 107 6

原创 安装第三方模块包的说明书?

NPM的全称是Node Package Manager 是node的包管理器,是全球最大的开源生态系统,作用就是管理模块包(node模块包可以理解为工具/插件/一段代码)package-lock.json记录模块之间的关系,记录所有的第三方模块包的结构和下载地址,下次安装的时候,能够提高下载速度。npm i 模块包名 -g 全局安装 将模块包安装到node根目录下 以后这台电脑所有的项目都可以直接使用这个模块。----所有的第三方模块包(下载安装的模块)使用的方式都是一样的,此文件以uuid举例。

2023-05-25 10:44:23 49 1

原创 如何开启和设置热部署?

npm i supervisor -g 全局安装。npm i nodemon -g 全局安装。运行文件 supervisor + 文件名。运行文件 nodemon + 文件名。

2023-05-25 10:41:24 361 1

原创 如何设置淘宝镜像?

yarn -v 如果能打印出版本号,说明安装成功。2.安装 cnpm 为淘宝镜像。1.配置 npm 为淘宝镜像。如果还想使用原来的国外的镜像。在国外,受网速影响比较大。

2023-05-25 10:40:22 1248 1

原创 Webpack的安装说明书

(4), 如果需要对多个js文件打包,而且还要使用webpack打包其他文件(例如css,图片文件),则必须使用webpack的配置文件进行具体的打包设置。如果连webpack-cli一起显示, 则不正常,表示webpack和webpack-cli版本不匹配, 需要安装指定版本的webpack和cli。(4)在使用了特殊的插件之后,还能打包一些框架独有的文件,例如vue的.vue文件,react的jsx文件。把a.js , b.js, 和 c.js中的代码打包到一起,写入x.js中。

2023-05-25 10:36:57 313 2

项目打包的word步骤

项目打包的word步骤

2023-06-12

Webpack的安装说明书

Webpack的安装时详细的步骤,以及兼容性的版本推荐

2023-05-25

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除