- 博客(22)
- 收藏
- 关注
原创 elementplus如何实现table的动态校验并实现高亮
一、实现步骤分析1.分为两种,提交全部和提交部分的校验2.校验后完成样式框的高亮展示,并且报错相对应错误二、template<template> <el-button @click="handleSumbit">提交</el-button>//校验全部 <el-button @click="handleRejuct">拒绝</el-button>//校验部分 <el-table ref="eltable"
2022-05-03 22:48:46
1242
原创 Typescript学习(二)
一、类型断言的用途1.将一个联合类型断言为其中一个类型注:联合类型可以断言为其中类型,父类可以断言为子类,任何类型可以断言为any类型,any类型可以断言为任意类型。interface Cat{ name:string; run():void;}interface Fish{ name:string; swim():void}function isFish(animal:Cat|Fish){ //if(animal.swim){这样会报错,因为没有判断它的类型 if((animal
2021-08-01 22:04:32
155
原创 TypeScript学习(一)
一、安装npm install -g typescript以上命令会在全局环境下安装tsc命令,安装完成之后,就可以在任何地方执行tsc命令。tsc hello.ts 可以编译成js文件生成tsc --outFile ./dist/abc.js hello.ts把hello.ts编译成hello.js放入dist里面二、原始数据类型1.布尔值的定义:let isDone:boolean=false2.数值的定义:let num1:number=103.字符串的定义:let str:strin
2021-08-01 20:15:17
123
原创 Node笔记(三)
一、创建服务器let http=require('http')let server=http.createServer( )server.on('request',(req,res)=>{ })server.listen(3000,( )=>{ })1.设置状态码和响应头response.writeHead(200,{'content-type':'text/plain'})2.设置响应头response.setHead(200,{'content-type':'tex
2021-07-17 23:06:44
228
原创 Node笔记(二)
一、Node之event事件整个事件驱动的流程有点类似于观察者模式,事件相当于一个主题(Subject),而所有注册到这个事件上的处理函数相当于观察者(Observer)。Node.js 有多个内置的事件,我们可以通过引入 events 模块,并通过实例化 EventEmitter 类来绑定和监听事件,如下实例:// 引入 events 模块var events = require('events');// 创建 eventEmitter 对象var eventEmitter = new eve
2021-07-17 22:32:41
85
原创 Node笔记(一)
一、node模块中的CommonJS应用通过require( )定义文件接收对象或变量(导入) 如:let a=require('a.js')将导出的变量或函数挂到exports对象的属性上,如果使用exports时,只能单个设置属性 如:let a=123, export.a=a使用module.exports对象整体到处变量或函数 如:module.exports={name:"zhangsan",age:18}二、模块路径解析规则1.如果是nodejs内置的模块名称,不需要路径
2021-07-17 21:43:45
58
原创 webpack入门级(三)
loader完成样式打包1.在src文件下创建style的css文件src/style.css2.在js文件下引入css文件3.要先安装style-loader、css-loadernpm install --save-dev css-loadernpm install --save-dev ts-loader4.在webpack.config.js中添加module转换成规则文件module.exports = { //入口文件 entry: "./src/index.js"
2021-07-16 22:08:22
53
原创 webpack入门级(二)
使用配置文件打包webpack.config.jsmodule.exports = { //入口文件 entry: "./src/index.js", output: { //输出文件名称 filename: "bundle.js", //输出的路径 //绝对路径 path: path.resolve(__dirname, 'dist') }, //开发模式 mode: 'd
2021-07-16 21:54:07
82
原创 mock模拟后端实现前后端同时开发
Mock是随机生成数据,拦截Ajax请求的框架api/mock.jsimport Mock from "mockjs"Mock.setup({ timeout: 1000 }) //直接使用字符串匹配路径还可以使用正则匹配路径Mock.mock('/api/user', {//可以使用正则/\/api\/user/ username: "小米", age: 18, gender: "男", type: '帅'
2021-07-16 21:40:09
341
原创 2021-07-16前后端跨域请求
方法一:在服务器部分添加允许请求的响应头app.use((req, res, next) => { res.append('Access-Control-Allow-Origin', '*') res.append('Access-Control-Allow-headers', '*') next() })方法二:vue内可以使用开发模式跨域解决方案与代理服务器proxy配置//vue.config.jsmodule.exports = { devServ
2021-07-16 21:29:59
110
原创 axios的二次封装和请求响应挟持
一、axios二次封装分别为request和response主要构成。//axios.jsimport axios from 'axios'import config from '@/config'const baseUrl = process.env.NODE_ENV === 'development' ? config.baseUrl.dev : config.baseUrl.proclass HttpRequest{ constructor(baseUrl){ th
2021-07-16 21:05:46
225
原创 webpack入门级(一)
一、全局安装webpack、webpack-clicnpm i webpack webpack-cli -g注:最好在管理员的模式下操作。二、在你要的文件夹下创建要的webpack文件夹mkdir demo1三、本地安装webpack、webpack-clicnpm i webpack webpack-cli --save-dev四、在你创建的demo1文件夹下创建src文件夹,里面放置的是你的html、js、json等文件。//src/index.jsimport data from "
2021-07-16 17:11:09
71
原创 前后台管理——富文本、图片上传、列表详情
一、根据用户权限角色设置限定用户访问页面editrole.vueonSubmit() { this.$message('submit!') let authIds = this.list.reduce((pre,item,index)=>{ if(item.isAuth){ pre.push(item.id) } return pre; },[]) let roleIds=authIds.join(',')
2021-05-30 22:43:16
308
原创 前后台管理接口相接
后台管理部分一、后台部分用thinkJs和mysql创建后台1、获取post提交用户名和密码async loginAction() { if (this.method == "POST") { let username = this.post('username') let password = this.post('password') let user = await this.model('member').
2021-05-30 21:05:40
320
原创 forEach如何遍历和删除自身
forEach的详解1、1输出了多少次?let arr = [1, 2];arr.forEach((item, index) => { arr.splice(index, 1); console.log(1); //输出几次?});console.log(arr)结果:1Array [2]2、this的回调指向arr.forEach(function(self,index,arr){},this);self:数组当前遍历的元素,默认从左往右依次获取数组元素。
2021-05-30 14:55:39
2510
原创 轮播图--小圆点篇
9.3小T学前端小圆点轮播练习思路:小圆点随着左右两边的按钮来进行移动来显示相对应的图片在选择单一的小圆点时会同时播放相对应的图片代码:prebtn.onclick = function() { n--; if (n < 0) { n = imgItems.length - 1 } imgItems.forEach(function(item, e) { item.class
2020-09-05 20:29:04
3703
原创 轮播图--渐隐显示
9.1小T学前端渐隐轮播图用透明度的方式来进行播放下一个,主要思路为:先清除所有的,再留自己。active为opacity: 1 。1.HTML<div class="swiper"> <div class="imgList"> <div class="imgItem active" style="background-image: url(3.img/img1.webp);"></div>
2020-09-01 21:54:29
424
原创 放大镜效果
8.30小T写前端练习放大镜效果mousemove、mouseenter、mouseleavemousemove:当鼠标指针在指定的元素中移动时触发事件mouseenter:当鼠标移动到指定的元素中时触发事件mouseleave:当鼠标从指定的元素中移出时触发事件在练习时遇到的pageX、pageY、offsetLeft、offsetTop、screenX、screenYpageX/pageY:在文档上鼠标的x/y的位置screenX/screenY:在屏幕上鼠标的x/y的位置offset
2020-08-30 22:36:21
104
原创 js打字小游戏(按键事件)
8.30小T开始在CSDN上记录对前端的练习打字小游戏(按键事件)keypress、keydown、keyup的区别keypress:按键按下时触发事件(注意不能识别功能键,如Ctrl、Shift及大小写)keydown:按键按下时触发事件keyup:按键松开时触发事件keydown、keyup不区分大小写在此练习会遇到String.fromCharCode()、Math.random()、toUpperCase()String.fromCharCode()可接受一个指定的 Unicode
2020-08-30 17:42:16
707
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人