前端学习
前端学习过程记录
兔头迟早要秃头
这个作者很懒,什么都没留下…
展开
-
关于antdpro的EdittableProTable编辑时两个下拉搜索框的数据联动以及数据回显(以及踩坑)
需求:使用antdpro的editprotable编辑两个下拉框,且下拉框是一个。下拉框1和2的值是一个编码和名字的联动关系,1变化会带动2,2变化会带动1的一个联动作用。(最后有略完整的代码,但是因为公司项目问题,删掉了一些不必要的代码,不确保运行成功)我使用的是renderFormItem进行渲染Select,并绑定了form。原创 2023-10-20 09:39:59 · 1661 阅读 · 0 评论 -
记录-vue和React渲染html字符串
当获取后端数据,例如富文本的数据,通常前端获取到是一串html的字符串。记录vue和react渲染html字符串的方式。原创 2022-12-16 14:51:32 · 694 阅读 · 0 评论 -
vuex的mutation/action个人学习总结
原创 2022-02-19 16:27:03 · 315 阅读 · 0 评论 -
vue路由传参方法汇总--path/name
path:路径name:组件名1.1、path// 带有路径的对象router.push({ path: '/users/eduardo' })// 我们可以手动建立 url,但我们必须自己处理编码router.push(`/user/${username}`) // -> /user/eduardo1.2、path+query/name+queryquery传参的时候,以path,name效果一样// 带查询参数,结果是 /register?plan=privateroute原创 2021-10-24 23:06:10 · 1357 阅读 · 0 评论 -
vue-批量删除遇到的问题
使用element-ui的表格后端需要的数据:?ids=1&ids=2使用axios.delete进行删除axios.delete(url,params)params是对象前端传递数据: batchDelete(){ let selectData = this.$refs.multipleTable.selection // 将id提取出来 for(let i=0;i<selectData.length;i++){ this原创 2021-10-11 15:30:31 · 336 阅读 · 0 评论 -
ES6笔记
1、变量声明 弱类型 var: 1、重复声明 2、变量提升 3、没有局部作用域(函数) let: 1、不可重复声明 2、不存在变量提升 3、存在局部作用域 4、 暂时性死区:在⼀个代码块中,let可以锁定某个变量 const: 1、常量,只能赋值一次的变量,其他与let保持相同特性let a = 3;a++; // 4const b = 3;b++; //errorconst obj = {age:1}obj.age++; // age 2原创 2021-10-06 17:15:29 · 370 阅读 · 0 评论 -
Ajax和axios的区别
1.查询字符串 key1=val&key2=val22.json字符串 ‘{“key1”:“val”,“key2”:“val2”}’3、如何利用$.ajax向后台发送json字符串数据? 1.将参数转换为json字符串 JSON.stringify( ) 2.将请求头设为json格式 contentType = 'application/json’4、Ajax和axios的区别Ajaxaxios自动将对象转换为查询字符串会自动将对象转换为原创 2021-10-06 15:26:35 · 92 阅读 · 0 评论 -
JSON.stringify和JSON.parse以及qs.stringify()
JSON.StringifyJSON.parseqs.stringify()将对象、数组转换成字符串;json.parse()将字符串转成json对象。qs.stringify()将对象 序列化成URL的形式’ { “name”:” XXX“, “age”:15,} ’{ name:” XXX“, age:15,}let params = { name: ‘XXX’, age: 15 }; qs.stringify(...原创 2021-09-17 20:15:39 · 166 阅读 · 0 评论 -
vue+spring:前端拿数据显示到页面的简单项目
最近在学vue,因为先学过一点的后端知识,所以有点想不通前后端连接的方式。这个案例是跟一个知乎博主写的,但是一直前端页面出不来,今天换了一个表单组件就运行成功了,所以记录下来。使用了mybatis连接数据库,spingboot和swagger连接,以及vue和element-ui的一个表单组件。数据库CREATE TABLE `user` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT 'ID', `email` varchar(255) NOT NU原创 2021-09-11 00:02:30 · 1488 阅读 · 0 评论 -
JS中关于原型链继承的理解
原型链的关系:constructor:指向构造函数prototype:存放方法和属性_ proto_:类似于指针通过调用构造函数,创建一个实例,每个构造函数都有一个原型对象prototype。实例被构造函数创建,就可以访问到构造函数的原型prototype,进而使用其中的方法和属性。而原型中则有一个constructor属性指向构造函数。关于原型链继承:dog的原型指向Annimal 可以继承到Animal的方法相当于将Animal的 __ proto __指向赋值给Dog的原型.原创 2021-09-08 20:28:03 · 70 阅读 · 0 评论 -
JavaScript:正则表达式各类字符方法汇总纪律
1、 直接量字符字母和数字字符自身\oNull字符\t制表符字符匹配\n换行符\v垂直制表符\f换页符\r回车符\将特殊字符转义成普通字符2、作用域匹配字符字符作用i:ignoreCase匹配时忽视大小写m:multiline多行匹配g:global全局匹配3、 正则表达式实例方法方法名称功能返回值exec用来匹配字符串中符合正则表达式的字符串返回值原创 2021-09-06 19:57:11 · 153 阅读 · 0 评论 -
javaScript:9个数组方法的重构
1、toString重写重写将将分隔符作为参数//toString重写Array.prototype.toString= function (a) { var str = ''; for(var i =0 ; i < this.length; i++){ if(i == this.length-1){ str =str + this[i] } else{ str =str + this[i] + a; } } return原创 2021-08-30 19:52:39 · 243 阅读 · 0 评论 -
JavaScript:函数function与方法method的区别?
函数function与方法method的区别?总结:类(对象)里边的是方法,类(对象)外边的是函数函数(function)可以直接用函数名字调用方法(method)通过对象调用。把函数写在对象里面,就变成了对象的方法。方法是函数的特殊情况。只是函数是全局的,而方法是局部的,是将函数给了当前对象。...原创 2021-08-26 16:36:30 · 625 阅读 · 0 评论 -
服务器部署jar包,打开swagger接口步骤
拿到后端jar包后1、连接服务器数据库的数据库中如果没有连接数据库先进行连接远程服务器数据库2、对连接的数据库创建用户给予服务器全部权限3、导入sql数据4、在服务器添加项目端口号进行访问5、在服务器运行上传的jar包 nohup java -jar xxxx.jar &使用nohup命令运行jar包,后面加上&符号,表示不挂断运行命令,当账户退出或终端关闭时,程序仍然可以运行$ nohup java -jar xxxx.jar &#查看j原创 2021-08-20 10:44:08 · 1293 阅读 · 0 评论 -
ubuntu安装和卸载数据库命令及过程
1、安装命令sudo apt-get install mysql-client mysql-server中间需要输入密码必须记住密码!而且尽量还是不要设置root这种普遍密码2、检查是否运行一般下载完成就是在运行sudo service mysql status3、检查是否安装成功sudo netstat -tap | grep mysql4、启动mysql mysql -u root -p 删除mysql1、删除数据库sudo apt-get remove mysql-*原创 2021-08-18 11:12:49 · 1007 阅读 · 0 评论 -
CSS:动画animations
-过渡和动画之间的异同1.1不同点过渡必须人为的触发才会执行动画动画不需要人为的触发就可以执行动画1.2相同点过渡和动画都是用来给元素添加动画的过渡和动画都是系统新增的一些属性过渡和动画都需要满足三要素才会有动画效果书写格式:@keyframes animiation名字{//可以十form–to 或者0–100% keyframes-selector{//属性:变化 css-style;原创 2021-08-15 16:29:57 · 73 阅读 · 0 评论 -
CSS过渡-Transitions
transition: 过渡属性 过渡时长 运动速度 延迟时间;-transition-propertytransition-durationtransition-timing-functiontransition-delay-过渡三要素 1.1必须要有属性发生变化 1.2必须告诉系统哪个属性需要执行过渡效果 1.3必须告诉系统过渡效果持续时长-要有过渡触发1、:hover 鼠标悬停触发2、:active 用户单击元素并按住鼠标时触发3、:focus 获得焦点时触发4、@me原创 2021-08-15 16:04:14 · 55 阅读 · 0 评论 -
CSS:父子级清除浮动方法
父子级清除浮动添加空白div。对其清除左右浮动:clear:both给父元素设置over-flow:hidden 解决上一种方法的弊端给父元素添加伪类元素::after.clearfix::after {content:"";display:block;clear:both;}...原创 2021-08-11 19:35:49 · 201 阅读 · 0 评论 -
CSS:兄弟级浮动
兄弟级浮动当某一个元素浮动时兄弟级元素为块级元素时如果块级元素设置了宽高,则效果与平常没有差别,兄弟块级和浮动元素独占一行如果块级元素没有设置宽高,但是兄弟块级里面有内容撑开,则兄弟块级和浮动元素依然各自独占一行兄弟级元素为行级元素时会出现字围现象浮动元素和行级元素会同在一行...原创 2021-08-11 19:35:18 · 335 阅读 · 0 评论 -
块级元素和行级元素特点区别整理
行级元素(行盒:inline)常见行内元素:span、a、(img、textarea、button、input)、label、select、canvas、audio、video,b, i, strong、em、br、(img、textarea、button、input):可设置宽高基本特点:1、不换行(与其他行级元素共享一行)2、由于不用来搭建网页结构,宽高不能改变(自适应宽高)3、img默认是行级元素,但是能修改宽高4、行级元素内不能嵌套块级元素5、水平方向排列面试题:如果行级与行级元素原创 2021-08-11 18:56:04 · 3611 阅读 · 1 评论 -
CSS:单色图标引入,多色图标引入
多色图标引入1、iconfont选择图标加入购物车2、点击购物车,添加到项目3、点击symbol,然后点击生成代码,然后点击复制代码4、引入 <script src="http://at.alicdn.com/t/font_XXXX_tjbvqijojl.js"></script>5、加上通用css代码.icon {width: 1em; height: 1em;vertical-align: -0.15em;fill: currentColor;over原创 2021-08-10 20:13:01 · 154 阅读 · 0 评论 -
css:水平垂直居中方法集合
搜索原创 2021-08-10 20:02:21 · 112 阅读 · 0 评论 -
vue:关于事件名大小写问题以及事件名命名规则
今天学习vue的内容分发遇到了一个绑定事件的时间名名称问题本来以为vue是支持驼峰命名法的,所以在v-on事件使用了驼峰命名法结果在绑定到组件的事件时,绑定不到在查了官方文档后才知道:因为html对大小写不敏感,所以像v-on:事件名,会被自动转换为小写,所以即使你写了大写也会被转换成小写,但是在script标签里面的写的方法名称等是大小写敏感,例如当使用this.$emit(‘v-on事件名’,index),这里的v-on事件名就算大小写名字一致,但是在DOM里面,v-on的事件名会转换成大小原创 2021-08-08 12:46:02 · 1773 阅读 · 1 评论 -
HTML标签笔记记录
HTML简介HTML可以使用.html与.htm作为HTML文件的后缀名(扩展名) HTML的历史版本发展 ①HTML 1.0:在1993年6月作为互联网工程工作小组(IETF)工作草案发布。 ②HTML 2.0:1995年1 1月作为RFC 1866发布,于2000年6月发布之后被宣布已经过时。 ③HTML 3.2:1997年1月14日,W3C推荐标准。 ④HTML 4.0:1997年12月18日,W3C推荐标准。 ⑤HTML 4.01(微小改进):1999原创 2021-08-03 10:48:57 · 106 阅读 · 0 评论 -
day2--axure高级功能(全局变量,局部变量,动态面板案例使用等)
axure高级功能一、变量的使用1.局部变量—只在该页面内有效。案例 求两个文本输入值的和命名两个文本框–num1 和 num2最后一个文本框名字为result 设置为禁用给等号设置鼠标点击事件–>设置文本—>目标元件(选择到名字为result 的文本框)—>设置到文本---->点击值的fx设置局部变量点击fx设置局部变量最终效果2、全局变量–多页面可用案例 点赞数增加设置文本框叫zanNum和一个点赞图标叫zanIcon给icon设置一原创 2021-07-29 20:31:56 · 906 阅读 · 0 评论 -
Http协议
Http协议1、请求报文请求行、请求头、空行和请求体,其中空行也是组成部分之一,作用是进行分隔,请求行第一行为请求行,由请求方法、URI和HTTP协议版本3个字段组成举例,GET /index.php HTTP/1.1,GET是请求方法,/index.php是URL,HTTP/1.1表示使用的HTTP版本为1.1。请求头请求头部由键/值对组成,每行一对,键和值用冒号“:”(英文)分隔。User-Agent:产生请求的用户代理信息(浏览器信息): Mozilla/5.0 (Macintosh;原创 2021-08-05 19:39:00 · 94 阅读 · 0 评论 -
HTML:列表-表格-表单-其他吧表单元素
HTML1、网页三要素HTML CSS JavaScript结构 表现 行为网页搭建构建 用于描述页面结构用于表现网页元素样式用于响应用户请求 行为+交互2.注释 ctrl+/ 养成良好习惯,用于给其他开发人员表述代码结构3、属性title:鼠标悬停后的提示文字id:唯一标识符class:类style:样式,行内样式4、实体空格: ; 大于号>:< ; 小于号<: &原创 2021-08-05 19:37:45 · 163 阅读 · 0 评论 -
CSS:引入方式+选择器+优先级
一、css的引入方式行内样式>内联样式/外部引入内联样式(行内样式)内部样式表-外部样式表<div style="color:red">设置文字的颜色为红色</div><style type="text/css"> p{ <br/> color:red; <br/> background-color:yellow; }</style><link rel="stylesheet" type="te原创 2021-08-05 19:32:50 · 192 阅读 · 0 评论