自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(40)
  • 收藏
  • 关注

原创 vue3中使用three.js记录

threejs记录

2023-12-25 16:28:50 586

原创 vue3使用时遇到的问题

问题描述:在el-form中的el-input中输入数字或字母时出现卡顿,输入不进去的现象问题原因:el-form的ref和model的名称写成了一样的单词问题解决:两个不能一样。

2023-11-10 21:40:35 504

原创 vue3项目学习:vite+vue3+ts

为了方便使用外部svg图标和element图标,这里选择封装一个svg组件,可以统一使用能够用到的所有svg图标。暂时没有用到,且较麻烦,过几天更新svg相关。element-ui对应vue3的版本为。

2023-09-19 16:08:26 595

原创 vue3项目学习:vite+vue3+js项目

使用vue-cli和vite创建vue3项目

2023-09-18 16:40:20 2068 1

原创 ESLint+Prettier+VSCode编程规范

Eslint+Prettier+VSCode编程规范

2023-09-18 16:37:51 697

原创 nodejs安装

使用vue前的准备工作:nodejs安装

2023-09-15 14:42:56 133

原创 node卸载和nvm安装

nvm安装以及nodejs卸载

2023-04-04 10:15:17 1287

原创 nps使用记录

nps内网穿透使用记录

2023-02-08 11:11:07 747

原创 vue3学习(第三天)

vue3学习

2023-02-03 17:10:25 196

原创 vue3学习(第二天)

vue3学习

2023-02-02 16:02:54 1452

原创 vue3学习(第一天)

vue3学习记录

2023-02-01 17:09:59 223

原创 webpack学习记录(一)

webpack基础(一)1.why webpack1.1 为什么需要webpack1.2. 如何解决作用域问题1.3. 如何解决代码拆分问题1.4. 如何让浏览器支持模块1.5 webpack和他的竞品2. 小试webpack2.1 安装webpack2.2 运行webpack2.3 自定义webpack配置3. 自动引入资源3.1 使用HtmlWebpackPlugin3.2 清理dist4. 搭建开发环境4.1 mode代码4.2 使用source map4.3 使用watch mode(观察模式)4.

2022-03-22 16:06:00 921

原创 nodejs学习记录--大事件后台API项目

node项目--大事件后台API项目1. 初始化1.1 创建项目1.2 配置 cors 跨域1.3 配置解析表单数据的中间件1.4 初始化路由相关的文件夹1.5 初始化用户路由模块1.6 抽离用户路由模块中的处理函数2. 登陆注册2.1 新建 ev_users 表2.2 安装并配置 mysql 模块2.3 注册2.3.0 实现步骤2.3.1 检测表单数据是否合法2.3.2 检测用户名是否被占用API接口文档.1. 初始化1.1 创建项目新建 api_server 文件夹作为项目根目录,并在项目

2022-03-18 16:07:20 1027 1

原创 nodejs学习记录--前后端身份认证

前后端身份认证1. Web开发模式1.1 服务端渲染的Web开发模式1.2 前后端分离的Web开发模式2. 身份认证2.1 Session 认证机制2.1.1 Cookie2.1.2 Cookie在身份认证中的作用2.1.3 Session的工作原理2.2 在Express中使用Session认证2.2.1 安装express-session中间件2.2.2 配置express-session中间件2.2.3 向session中存数据2.2.4 从session中取数据2.2.5 清空session2.3

2022-03-16 16:41:02 2733

原创 nodejs学习记录--express路由

express中间件1. Express 中间件1.1Express中间件的格式1.2 next函数的作用2. 中间件使用2.1 最简单的中间件2.2 全局生效的中间件2.3 定义全局生效的简化中间件2.4 定义多个全局中间件2.5 局部生效的中间件2.6 定义多个局部中间件2.7 中间件的分类2.8 使用Express写接口2.8.1 编写GET接口2.8.2 编写POST接口2.8.3 基于cors解决接口跨域问题1. Express 中间件中间件的调用流程:1.1Express中间件的格式

2022-03-16 09:15:16 2502

原创 nodejs学习记录--express和路由

express学习1. 了解Express2. Express使用2.1 安装2.2 创建一个基本的web服务器2.3 监听GET请求2.4 监听POST请求2.5 把内容响应给客户端2.6 获取URL中携带的查询参数2.7 获取URL中的动态参数3.托管静态资源3.1 express.static()3.2 托管多个静态资源目录3.3 挂载路径前缀4.nodemon4.1 安装nodemon4.2 使用nodemon1. 了解ExpressExpress是基于Node.js平台,快速、开放、极简的We

2022-03-15 16:03:24 730

原创 nodejs学习记录--npm和包

nodejs内置API——npm和包npm与包1 包2 npm使用3 包管理配置文件3.1 快速创建package.json3.2 dependencies节点3.3 安装所有包3.3.4 卸载包3.3.5 devDenpendencies节点4. 包的分类4.1 项目包4.2 全局包5. 规范的包结构6. 开发属于自己的包6.1 初始化包的基本结构6.2 初始化package.json6.3 在index.js中定义我们需要上传的方法6.4 分模块6.5 编写包的说明文档7. 发布包7.1 注册npm账号

2022-03-15 10:05:36 334

原创 nodejs学习记录--模块化

nodejs内置API——模块化模块化1. 概念2. node.js中的模块化2.1 nodejs中的模块分类2.2 加载模块2.3 模块作用域2.4 共享模块作用域中的成员模块化1. 概念提高了代码的复用性提高了代码的可维护性可以实现按需加载2. node.js中的模块化2.1 nodejs中的模块分类内置模块(由node.js官方提供的,如fs、path、http)自定义模块(用户自己写的js文件)第三方模块(由第三方开发的使用前需下载的模块)2.2 加载模块使用req

2022-03-15 10:02:04 965

原创 nodejs学习记录--http

nodejs内置API——httphttp模块创建web服务器1. 导入http模块2. 创建web服务器实例3.为服务器实例绑定request事件,监听客户端请求3.1 req请求对象3.2 res响应对象3.2.1 解决中文乱码4. 启动服务器5. 根据不同url响应不同的html内容5.1 实现步骤:5.2 动态响应内容5.3 把文件实际存放路径作为每个资源的请求url地址http模块创建web服务器1. 导入http模块2. 创建web服务器实例3.为服务器实例绑定request事件

2022-03-14 16:52:31 259

原创 nodejs学习记录--了解并下载node

nodejs简介了解nodejsnodejs中的JavaScript运行环境node可以做什么学习路径安装nodejs下载nodejs查看版本号了解nodejsnodejs:一个能够在服务器运行的JavaScript开源代码,跨平台JavaScript运行环境,相当于单线程web服务器中文官网: https://nodejs.org/zh-cn/.nodejs中的JavaScript运行环境node可以做什么学习路径安装nodejs下载nodejs下载后打开安装包,一路next就可

2022-03-14 15:06:47 406

原创 nodejs学习记录--fs和path

nodejs内置API——fs和pathfs文件系统模块读取指定文件内容1.fs.read File()语法格式2.示例3.判断是否读取成功向文件中写入内容1.fs.writeFile()的语法格式2.示例path路径模块路径拼接1. path.join()2. path.basename()3. path.extname()fs文件系统模块读取指定文件内容1.fs.read File()语法格式2.示例3.判断是否读取成功向文件中写入内容1.fs.writeFile()的语法格式

2022-03-14 15:05:26 116

转载 echart配置

theme = { // 全图默认背景 // backgroundColor: 'rgba(0,0,0,0)', // 默认色板 color: ['#ff7f50','#87cefa','#da70d6','#32cd32','#6495ed', '#ff69b4','#ba55d3','#cd5c5c','#ffa500','#40e0d0', '#1e90ff','#ff6347','#7b68ee','#00fa9a',

2021-08-04 14:18:13 265

原创 canvas学习——第四天

canvas学习——第四天canvas太阳系研究了一下canvas太阳系,总结一下…暂时用了几张图片来代替一下地球和月球,之后再进行优化,大致是这样的:我是在vue项目上面使用的,先说一下使用时出现的一些问题:首先是在canvas上使用图片时不显示图片,开始我是这样写的:可以看到已经是读取到地址了,但是就是不显示,就很烦,但是如果是static的路径时会正常读取到,后来百度找到路径这样写:这样会正常显示图片,具体的原因好像是webpack打包问题,读取assets里的图片时需要requi

2021-02-22 16:54:40 352

原创 canvas学习——第三天

canvas学习第三天使用canvas将文字生成图片最后的结果就是类似这个样子,生成图片后将图片上传服务器后大功告成,正好可以使用之前学的canvas相关,ok,直接上代码: drawLogo() { const text = this.text // 要生成图片的文字 const font = '微软雅黑' // 字体 const fontSize = '70' // 字号 const fontCor = '#5076B8'// 颜色

2021-02-22 14:29:32 130

原创 canvas学习——第二天

偷偷学习canvas第二天使用canvas添加样式1.fillStyle = color 填充颜色2.strokeStyle = color 轮廓颜色用之前的图形举例: draw() { const canvas = document.getElementById('canvas') // 获取canvas if (canvas.getContext) { // 检测支持性 const ctx = canvas.getContext('2d')

2021-02-21 14:02:00 161 1

原创 canvas学习——第一天

偷偷学习canvas第一天之前看到有人用canvas做了很多好玩的动画以及简单的游戏,感觉很有意思,所以也来从头记录一下学习过程。一、canvas 简介​ 是 HTML5 新增的,一个可以使用脚本(通常为 JavaScript) 在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画,甚至可以进行实时视频处理和渲染。​它最初由苹果内部使用自己 MacOS X WebKit 推出,供应用程序使用像仪表盘的构件和 Safari 浏览器使用。后来,有人通过 Gecko

2021-02-05 17:05:15 177

原创 vant--List列表使用

记录使用vant–list的下拉刷新以及分页功能vant链接.首先是分页,需要根据page,limit来获取数据,使用vant的代码做示范:<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad" >

2021-01-11 11:47:50 6187 2

原创 谷歌浏览器调试手机外观

首先外观是这个样子的:使用f12打开是大家都知道的,然后切换成手机模式,然后选择就是标红框的这个,切换成show device frame 就可以,快去试试吧!

2020-12-14 20:10:32 4641 1

原创 一步步创建一个vue项目(六)封装axios

一步步创建一个vue项目(六)封装axios安装axiosnpm install axios -S在utils文件下创建http.js文件,里面写:import axios from 'axios';// import { Toast } from 'vant';import { Message, MessageBox} from 'element-ui';import store from '../store'; //这里是为了调用store的FedLogOut方法,可以不使用

2020-11-14 09:50:47 340

原创 vscode配置ESLint+Prettier - Code formatter+Vetur

首先是安装ESLint+prettier+vetur:vscode 搜索安装即可,然后是注意package是否有这些:没有的话npm安装。之后就是配置这个文件:module.exports = { root: true, parser: 'babel-eslint', parserOptions: { sourceType: 'module', }, env: { browser: true, node: true, }, extends:

2020-10-30 13:49:42 3058 2

原创 element-ui upload上传图片的一次坑

在实现图片上传时遇到了一个坑,十分难受,还是技术不到位,记录下来:主要代码://组件使用: <el-upload action="" list-type="picture-card" :on-preview="handlePictureCardPreview" :on-remove="handleRemove" :http-request="uploadFile"

2020-10-27 11:36:43 1203 1

原创 一步步创建一个vue项目(五)标签栏

一步步创建一个vue项目(五)标签栏实现根据route内容实现标签栏这里是依据vue-element-admin中的代码,通过自己整理后将自己整理的一些内容列出来:首先是要实现的功能:1.点击左面的导航栏右面会出现相对应的标签和页面(可关闭)2.判断页面是否活跃,哪些页面是活跃状态目前只实现了这两个功能这里的标签页的记录使用了store,把哪些页面打开,哪些页面关闭使用store记录,主要代码以及注释我都标了出来:首先在store里创建一个值用来存路由的状态:visitedViews然后

2020-10-27 09:56:05 632 1

原创 一步步创建一个vue项目(四)面包屑

一步步创建一个vue项目(四)面包屑根据element-ui生产面包屑就是这个样子这个代码是根据vue-element-admin中的代码通过理解整理出来的代码:<template><!-- separator:分隔符 --> <el-breadcrumb class="app-levelbar" separator="/"> <el-breadcrumb-item v-for="(item, index) in levelList" :k

2020-10-26 09:28:19 757

原创 一步步创建一个vue项目(三)根据路由生成一个侧边栏(二)

一步步创建一个vue项目(三)根据路由生成一个侧边栏大致的样子:配置想要的路由比如我的路由文件:router/index.jsimport Vue from 'vue'import Router from 'vue-router'import Layout from '../views/layout/Layout'const _import = require('./_import_' + process.env.NODE_ENV)Vue.use(Router)export defau

2020-10-23 15:59:22 1973

原创 一步步创建一个vue项目(三)根据路由生成一个侧边栏(一)

一步步创建一个vue项目(三)根据路由生成一个侧边栏先创建几个文件,主要是下面几个:生成三部分import 多个scssimport的时候注意name路由router生成sidebar侧边栏

2020-10-23 15:48:41 1342

原创 一步步创建一个vue项目(二)

一步步创建一个vue项目(二)配置路由首先是router/index.js文件,通常是这个样子的:使用cross-env和_import如果路由不多的话不需要使用这个。如果页面太多的话每次引入一个页面都需要写一个import … from …,所以这里使用了:const _import = require('./_import_' + process.env.NODE_ENV),这样遇到需要引入的页面时只需要这样写:直接使用_import(‘文件夹名/文件名’)就可以了,process.e

2020-10-23 11:31:40 233

原创 一步步创建一个vue项目(一)

cross-env生成三部分路由router生成sidebar侧边栏

2020-10-23 11:07:52 278

原创 element-ui分页与CheckBox兼容问题

记录element-ui分页与复选框出现的问题element-ui 分页element-ui 表格复选框主要问题解决问题element-ui 分页先把官网地址放上来:https://element.eleme.cn/#/zh-CN/component/pagination.如果是单纯在一个表格使用分页组件的话是没有问题的,element的分页组件使用起来十分简便,可以省很多事情。代码如下:<!--分页--> <el-pagination

2020-08-06 13:39:27 660

原创 element-UI 侧边栏

element-ui侧边栏官网地址.代码:<el-menu default-openeds="['1','3']" //默认index为1和3的菜单展开 default-active="2" //默认选中的菜单 class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose"> <el-submenu

2020-07-29 15:03:09 1801

原创 Vue命名视图

Vue命名视图今天在学习Vue的时候被命名视图困扰了一上午,明明是正确的语句缺无法渲染出页面,按照官方以及网上的很多资料也没有解决问题,结果重新创建了一个新项目复制过去之后成功了,也是醉了。首先放上官方链接:https://router.vuejs.org/zh/guide/essentials/named-views.html.命名视图简单来说就是在一个页面同时使用多个组件,多个视图同时存在一个路径之中,这时候就需要多写几个router-view了,把不同的router-view设置不同的name,

2020-07-23 14:03:43 1071

空空如也

空空如也

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

TA关注的人

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