技术
文章目录
- 1.operation
- 2.configuration
- 3.others
- 4.knowledge
- #数据库UUID
- 4.1 main
- 4.2 vue_elementui_css
- 1 公共属性
- 4.2.1 CSS样式功能
- 4.1.6 this.$createElement
- 4.2.1 截取字符串
- 4.2.2 获取标签上属性值
- 4.2.3 对象key,value获取等
- 4.2.4 字符串处理 slice, splice等
- 4.2.5 对象赋值的是地址解决方案
- 4.2.6 根据属性名使用对象中对应属性
- 4.2.7 对象属性变更+数组变更+长度变更
- 4.2.8 组件
- 4.2.9 获取对象所有实例属性
- 4.2.10 去重
- 4.2.11 ...
- 4.2.12 报错
- 4.2.13 数据类型
- 4.2.14 滚动
- 4.2.15 键盘鼠标事件
- 4.2.15 vue挂载全局$
- 4.3 JAVA
- 4.4 文档
- 4.5 解决思路
- 4.6 concept
- 4.5 解决思路
- 4.6 concept
1.operation
tail -f /opt/apache-tomcat/logs/catalina.out
ssh 10.30.24.167
1.1 IDEA系列
# 编码格式UTF-8 换行UNIX
https://www.bbsmax.com/A/obzb74AVJE/
X1 远程debug
edit Run Configurations
-> remote JVM Debug
-> [Name]
[Host]远程ip
[Port]远程端口 - env/jvm.options
[Command line arguments for remote JVM]
1.1.1 撤回与反撤回
撤回:Ctrl + Z
反撤回: Ctrl + Shift + Z
Shift + Alt + Del
1.1.2 最近修改
1.1.2.1 直接跳转
Ctrl + Alt + ← / →
1.1.2.2 窗口查看详细(可点击跳转)
Ctrl + Shift + e
1.1.2.3 窗口查看修改的文件
Ctrl + e
1.1.3 整齐划一
Ctrl + Alt + L
1.1.4 换换行
Ctrl + Shift + ↑ / ↓
1.1.5 翻译吧!
Ctrl + Shift + O
不会只有便携版有效吧!!!
1.1.6 追溯来源
Ctrl + Shift + I
1.2 Win10
1.2.1 截图
Ctrl + Win + S
2.configuration
> 字符规则:utf8mb4 -- UTF-8 Unicode
排序规则:utf8mb4_unicode_ci
> 表存储引擎使用 InnoDB 引擎,支持事务控制
> | 字段名 | 类型 | 长度 |默认值|备注|
| ------------ | ------ | --- | --- |----|
| S_ID |varchar | 100 | | |
|DT_CREATE_TIME|datetime| 0 | | |
|DT_UPDATE_TIME|datetime| 0 | | |
|S_CREATE_USER |varchar | 0 | | |
|S_UPDATE_USER |varchar | 0 | | |
3.others
# 自动关机
计算机-管理-系统工具-任务计划程序-任务计划程序库- shutdown -f -s -t 900
#1 google chrome
> C:\Users\09955\AppData\Local\Google\Chrome\Application\chrome.exe --disable-web-security --user-data-dir=D:\appData\MyChromeDevUserData
* --disable-web-security 跨域
* --user-data-dir=D:\appData\MyChromeDevUserData 用户数据存储
>
#2 网页-遮罩阻挡阅读全文
显示全文:
blog-content-box {
article_content {overflow:hidden;height:2000px}注释掉
}
删掉遮罩:hide-article-box hide-article-pos text-center : {
disaplay: none;
}
4.knowledge
#数据库UUID
select UUID() from dual;
4.1 main
1 汉字正则 [\u4e00-\u9fa5]
4.1.3 远程桌面
Win+R 搜索 mstsc Microsoft Terminal Services Client
>前提
计算机->属性->更改设置->远程->允许访问
`tips:
仅允许运行使用网络级别身份验证的远程桌面的计算机连接--勾选-->在网络访问阶段(连接到电脑前)输入用户名和密码;
--不勾选-->连接到电脑,在登录界面输入密码
4.1.7 Linux
4.1.7.1 防火墙
systemctl stop firewalld 直接关闭服务
service firewalld stop 关闭服务
systemctl status firewalld --查看状态
service firewalld restart --重启
systemctl disable firewalld
firewall-cmd --query-port=8080/tcp 查看端口是否开放
firewall-cmd --permanent --add-port=80/tcp 开放端口
firewall-cmd --permanent --remove-port=80/tcp 移除端口
firewall-cmd --reload 重启 修改配置后需要重启
4.1.7.2 常用命令
tail -f *.log 查看日志
chmod -R 777 * # 赋权限
netstat -ntlp 服务启动项
kill -9 8741 关闭服务
4.1.8 widget操作
4.1.8.1 idea系列
通配符 查找 .*按钮开启
4.1.8.2 快捷键
alt+tab:更换窗口 ctrl+tab:更换页面 win+tab:更换窗口 win+D:最小化所有窗口
win+L:电脑锁屏 win_shift+S:电脑截屏 win+,:查看主界面 win+。:调用电脑表情符号
win+空格:切换语言 win+R:调用运行窗口 win+ +/-:调用放大镜 win+↑/↓:界面的显示与隐藏
win+←/→:界面的左右分屏 ctrl+W:快速关闭当前页面
ctrl+C:复制 ctrl+V:粘贴 ctrl+A:全选 ctrl+X:剪切
ctrl+S:保存 ctrl+Z:撤销
win+ctrl+D:创建虚拟桌面 win+ctrl+←/→:切换虚拟桌面 ctrl+shift+T:逐个恢复当前页面 win+E:打开我的电脑
ctrl+Y:反撤销 ctrl+backspace:向左删除词 ctrl+delete:向右删除词 win+V:打开剪贴板
win+W:打开白板
win+ctrl+F4:关闭当前虚拟桌面
shift+滚轮:左右移动屏幕
ctrl+H:打开历史记录
ctrl+alt+delete:计算机END页面
win+S:打开搜索功能
shift*5:开启粘滞键
同时按shift/ctrl/alt/win任意两键关闭粘滞键
alt+F4:电脑关机
ctrl+shift+esc:打开任务管理器
F2:重命名
F5:刷新
F11:全屏模式
F12:开发者模式
insert:插入模式
numlock:当灯亮起后启用数字键盘
4.1.9 hosts文件位置 C:\Windows\System32\drivers\etc
C:\Windows\System32\drivers\etc
作用: “本地DNS配置”,取代访问远程DNS,输入后置位的值默认访问前置位ip
localhost 不可被操作(无效)
127.0.0.1 xxx.xx 则 xxx.xx 被屏蔽 (原理:访问xxx.xx时改为访问 127.0.0.1, 取代访问远程DNS的对应ip)
后置位写ip 无效!!
原理(会和真正的对应ip冲突,比如 192.168.15.73,在访问该网址时,默认访问ip,不识别为‘DNS’)
4.2 vue_elementui_css
表格校验
props
<el-form-item :label="dialogForm.qualityInfoVoList[2 * (index_1-1) + (index_2-1)].name"
:prop="`qualityInfoVoList.${2 * (index_1-1) + (index_2-1)}.num`"
:rules="[{required: true, message: dialogForm.qualityInfoVoList[2 * (index_1-1) + (index_2-1)].name+$t('materialSituationSetting.NOT_ALLOW_NULL'), trigger: 'blur'}]"
>
<td-input-number
v-model="dialogForm.qualityInfoVoList[2 * (index_1-1) + (index_2-1)].num"
></td-input-number>
</el-form-item>
1 公共属性
window
- window.screen.width
- window.innerHeight
- window.location.origin
- window.location.pathname
document
- document.body.clientHeight
Others
window.vue.$store.state.skin
window.vue.$store.state.fontSize
4.2.1 CSS样式功能
4.2.1.0 Base
4.2.1.0.1 initial
- 默认
4.2.1.0.2 inherit
- 继承
4.2.1.0.3 unset
- 不设置
4.2.1.0.4 revert
- 还原
4.2.1.1 display
4.2.1.1.1 flex
-
概念: 弹性布局—扩展和收缩flex容器内的元素,填充可用空间。
-
失效: float,clear,vertical-align
-
附属:
水平对齐方式: justify-content (flex-start | flex-end | center | space-between | space-around | space-evenly)
垂直对齐方式(垂直中分线为基准): align-items (baseline | center | flex-end | flex start | stretch)
4.2.1.1.2 inline
- display: inline
当前元素(div) 在它所在容器中 和其他元素在同一行,宽度不够自动换行
4.2.1.2 position
4.2.1.2.1 static
- 默认值
- 按源码顺序决定元素位置
- 各自占有区块block,不重叠
- top,bottom,left,right无效
4.2.1.2.2 relative
- 相对于static位置偏移
4.2.1.2.3 absolute
- 相对上级元素偏移
- 父元素不能是static
4.2.1.2.4 fixed
- 相对于视口(viewport)
- 元素位置不随页面滚动而变化
4.2.1.2.5 sticky
-
粘性定位元素
-
目标区域以内–>relative
-
偏移达到定位要求时–>fixed
-
必须指定top,botton,left,right之一,否则只能relative
-
父元素height>sticky元素
-
sticky元素仅在父元素内生效
-
父元素不可overflow:hidden | auto
4.2.1.3 transition|animation
transition|animation包含三个常用属性:
transition-property:过渡属性(例如:transform旋转)
transition-duration:过渡持续时间(例如1s)
transition-timing-function:过渡函数(调整过渡的不同速度变化,匀速、慢快慢、匀速慢,可以按“F12”,查看不同的函数效果)
transition-delay:过渡延迟时间(意为,等待一段时间后,再执行动画)
1、animation-name :xx (设置关键帧的名称为xx)
2、animation-duration:5s (动画持续时间为5s)
3、animation-timing-function: linear (动画时间曲线 也叫做运行速度为匀速)
取值:
linear 匀速、 ease (默认)低速开始—>加速—>结束前减速 、
ease-in 以低速开始、ease-out 以低速结束、ease-in-out 以低速开始和结束。
cubic-bezier(n,n,n,n) 在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。
4、animation-delay:5s (动画等待5后开始)
5、animatiom-iteration-count:1 (动画播放次数为1次)
取值:xx数字,定义应该播放xx次动画、 infinite-无限次执行
6、animation-direction: alternate(设置动画为反向播放 )
取值:
nomal(默认)-执行完一次之后回到起点继续执行下一次
alternate-往返动画,执行完一次之后往回执行下一次
reverse-反向执行
7、animation-fill-mode: (动画结束的最后一帧)
取值:
none-不做任何改变
forwards-让元素结束状态保持动画最后一帧的样式
backwards-让元素等待状态的时候显示动画第一帧的样式
both-等待状态显示第一帧,结束状态保持最后一帧
8、animation-play-state: (设置动画是否暂停)
取值:running-执行动画 、paused-暂停动画
四个属性可以放在一起写:
transition : transform 1s ease 1s;
animation:动画名称 动画时长 动画运动速度 延迟时间 执行次数 往返动画
animation:动画名称 动画时长 (有这两个即可以完成动画,其它未设置,有默认值)
简单动画用transition,其他用 animation
transition 可以通过设置时长为 0 来重置
animation 可以通过设置 none 来重置
在 :active 时重置动画,点击后会再次运行动画
复杂的动画可以借助现有的动画库,例如 anmate.css
设置动画时长为 0 可以避免首次渲染出现动画
4.2.1.4 transform-rotate3d|scala3d
[rotate3d]:rotate3d() CSS 函数定义一个变换,它将元素围绕固定轴移动而不使其变形。运动量由指定的角度定义; 如果为正,运动将为顺时针,如果为负,则为逆时针。
x 类型,可以是 0 到 1 之间的数值,表示旋转轴 X 坐标方向的矢量。
y 类型,可以是 0 到 1 之间的数值,表示旋转轴 Y 坐标方向的矢量。
z 类型,可以是 0 到 1 之间的数值,表示旋转轴 Z 坐标方向的矢量。
a 类型,表示旋转角度。正的角度值表示顺时针旋转,负值表示逆时针旋转。
4.2.1.N Others
<div style="border: none;">
<div style="display: inline;" v-for="item in base.cardInfo.actVos" :key="item.sId" :title="item.sActName">
<td-button class="label_btn" >
{{ item.sActName }}
</td-button>
</div>
</div>
<style>
.label_btn {
margin: 10px 2.5%;
height: 40px;
width: 220px;
margin-top: 20px !important;
margin-left: 30px !important;
border-radius: 10px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
</style>
- <div>标签中 :title 属性
悬浮显示详情
- ! important
提高样式优先级,覆盖原有样式
- <style>标签 属性 scoped
标签私有化,不污染全局
- overflow: hidden; //隐藏超出部分
white-space: nowrap;//使文本显示在一行中,防止文本域换行
text-overflow: ellipsis;//省略号
省略过长部分,显示省略号
- border-radius: 10px
为元素添加圆角边框
4.1.6 this.$createElement
const h = this.$createElement;
this.$notify({
title: this.$t("karen.RICE_BACKLOG"),
message: h(
"p",null,
[
h("div",
null,
[
h("span",null,"督导类型:"),
h("span",
{
style: 'margin-left: 20px'
},
this.backlog.supervision.cardType
)
]
),
h("div",
null,
[
h("span",null,"督导区域:"),
h("span",
{
style: 'margin-left: 20px'
},
this.backlog.supervision.areaName
)
]
),
h("div",
null,
[
h("span",null,"问题行为:"),
h("span",
{
style: 'margin-left: 20px'
},
this.backlog.supervision.behaviorName
)
]
),
h("div",
null,
[
h("span",null,"期限时间:"),
h("span",
{
style: 'margin-left: 20px'
},
sup.limitTime//TODO期限时间格式+字段名确定
)
]
), h("br"),
h(
"a",
{
style: "color: #409EFF; cursor: pointer;align: right",
on: {
click: () => {
this.openSupervise()
}
}
},
"去处理"
)
]
),
// message: '123',
position: 'bottom-right',
showClose: false,
offset: 100,//偏移
});
4.2.1 截取字符串
let str = 'abcdef';
// 0
str = str.slice(0);//返回整个字符串 abcdef
str = str.substring(0);//返回整个字符串 abcdef
str = str.substr(0);//返回整个字符串 abcdef
// 使用一个参数
str = str.slice(2);//截取第二个之后所有的字符 cdef 即从第三位开始
str = str.substring(2);//截取第二个之后所有的字符 cdef
str = str.substr(2);//截取第二个之后所有的字符 cdef
// 使用两个参数
str = str.slice(2,4);//截取第二个到第四个之间的字符 cd
str = str.substring(2,4);//截取第二个到第四个之间的字符 cd
str = str.substr(2,4);//截取从第3个开始往后数4位之间的字符 cdef
// 使用两个负数
str = str.slice(1,-3);//截取第二个到第四个之间的字符 bc
str = str.substring(1,-3);//截取第二个到第四个之间的字符 a #负数转换为0
str = str.substr(1,-3);//不能为负数,若强行传递负数,会被当成0处理 ' ' #负数转换为0
console.log(str)
4.2.2 获取标签上属性值
<div id="app">
<button data-num="100" ref="dataNum" @click="getData($event)">
点我
</button>
</div>
getData(e){
console.log(this.$refs.dataNUm.dataset.num)
}
<div id="app">
<button data-num="100" @click="getData($event)">
点我
</button>
</div>
getData(e){
console.log(e.target.getAttribute('data-num'))
}
4.2.3 对象key,value获取等
1、取对象的key
Object.keys(obj) 返回一个表示给定对象的所有可枚举属性的字符串数组
var obj = { foo: 'bar', baz: 42 };
console.log(Object.keys(obj)); // ['foo', 'baz']
2、取对象的value值
方法一:**Object.values(obj)**返回一个给定对象自身的所有可枚举属性值的数组,值的顺序与使用 for…in 循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。
var obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]
console.log(Object.values('foo')); // ['f', 'o', 'o']
方法二:
let obj = {
a:'aa',
b:'bb',
c:'cc',
d:'dd'
};
for(let i in obj){
console.log(i); //a b c d
console.log(obj[i]); // aa bb cc dd
}
//如果想把值整合在一起,可以var一个数组,然后将值push进数组里
方法三:
var obj = { foo: 'bar', baz: 42 };
Object.keys(obj).map((key)=>{ console.log(obj[key])});//依次返回 bar 42
3、将key和value都取出来并转成数组
Object.entries() 返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组
var obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [['foo', 'baz'],['bar',42]]
4、将多个对象合并为一个并去重
Object.assign方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);//{a: 1, b: 4, c: 5}
4.2.4 字符串处理 slice, splice等
slice(start, end), 从start 到end ,左闭右开
4.2.4.1 vue判断字符串中是否包含某个字符串
includes方法
var str = “hello world”;
v-if=“str.includes(“world”)”
indexOf方法
v-if=“str.indexOf(“world”) !== -1”
4.2.5 对象赋值的是地址解决方案
let rat = Object.assign({}, this.student)
let rat = JSON.parse(JSON.stringify(this.student))
4.2.6 根据属性名使用对象中对应属性
student["name"] = "张超然"
4.2.7 对象属性变更+数组变更+长度变更
>>>>>>>>>>>>> 对象属性变更
Vue.set(this.student, key, value)
Vue.set(this.student, "name", "zcr")
this.$set(this.obj, key, value)
this.$set(this.student, "name", "zcr")
this.student = Object.assign({}, this.student, {name: "zcr",age: 18})
>>>>>>>>>>>>> 数组变更
this.$set(array, index, newValue)
this.$set(this.options, 3, "甜甜圈")
array.splice(index, 1, newValue)
this.options.splice(3, 1, "甜甜圈")
>>>>>>>>>>>>> 长度变更
this.name.splice(newLength)
4.2.7.2 对象中属性(键值对)的操作
- 新增和修改
this.$set(rob, key, value)
- 删除
this.$delete(rob, key)
delete rob.key
- 修改key
rob.newKey = rob.oldKey
delete rob.oldKey
rob['newName'] = rob['oldName']
delete rob['oldName']
4.2.8 组件
4.2.8.1 基本使用
<inx-child :inxProp="inxData" inxProp1="数据常量"></inx-child>
<script>
import inxChild from './components/inxChild.vue'
export default {
components: {
inxChild
},
data() {
return {
inxData: '变量数据'
}
}
}
</script>
<el-form>
<el-form-item>
<el-input v-model="inxProp"></el-input>/* 值为 变量数据*/
</el-form-item>
<el-form-item>
<el-input v-model="inxProp1"></el-input>/* 值为 数据常量*/
</el-form-item>
<el-form-item>
<el-button @click="btn">按钮</el-button>
</el-form-item>
</el-form>
<script>
export default {
props: {
inxProp: '',
inxProp1: ''
},
data() {
return {
}
},
methods: {
btn() {
console.log(this.inxProp, this.inxProp1) //输出 变量数据 数据常量
}
}
}
</script>
4.2.8.2 $emit
子组件调用父组件方法,传值
clickCancel(rat1, rat2, rat3) {
this.$emit('closeDialog', rat1, rat2, rat3)
}
//closeDialog是父组件方法
//父组件接收到参数后,可视为正常变量操作
4.2.8.3 props
子组件属性
和data,methods等同级,
通过父组件写入标签中的属性及其赋值,获取值
export default {
props: {
detail: {}//父组件传入 :detail="{rat=1, rat2='123'}"
},
data() {
return {
}
}
}
//调用时,直接使用this.detail
4.2.8.4 watch
监听函数
['param.query.reportStartTime'](val) {
let dateVal = this.param.query.reportEndTime;
if (dateVal && val && new Date(val).getTime() > new Date(dateVal).getTime()) {
this.param.query.reportEndTime = val;
}
},
['param.query.reportEndTime'](val) {
let dateVal = this.param.query.reportStartTime;
if (dateVal && val && new Date(dateVal).getTime() > new Date(val).getTime()) {
this.param.query.reportStartTime = val;
}
}
4.2.9 获取对象所有实例属性
Object.keys()//返回包含对象键名的数组
Object.values()//返回包含对象键值的数组
Object.entries()//返回包含对象键名和键值的数组
Object.getOwnPropertyNames()
for-in 循环
<script>
export default {
methods: {
osp() {
console.log("keys:",Object.keys(rob[0]))
console.log("values:",Object.values(rob[0]))
console.log("entries:",Object.entries(rob[0]))
console.log("getOwnPropertyNames:",Object.getOwnPropertyNames(rob[0]))
let rat1 = []
for (const robKey in rob[0]) {
rat1.push(robKey)
}
console.log("rat1",rat1)
}
}
}
</script>
其他
console.log("111:", Object.getOwnPropertyDescriptors(rob[0]))
console.log("112:", Object.getOwnPropertySymbols(rob[0]))
console.log("113:", Object.getPrototypeOf(rob[0]))
4.2.10 去重
Array.from(new Set(rob))
4.2.11 …
扩展运算符
对数组和对象而言,就是将运算符后边的变量里的东西每一项拆下来 //似乎对象不行
可以在函数定义中使用:
func(...args) {
}//将函数传入的参数都放在args数组里
4.2.12 报错
4.2.12.1 Parameter args is not described in JSDoc
Parameter args is not described in JSDoc
注释和实际方法不一
4.2.12.2 Invalid attempt to spread non-iterable instance
TypeError: Invalid attempt to spread non-iterable instance
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
使用公共组件中的扩展运算符 ... 处理非 数组或对象类型的数据
解决-> 判断 :
osp (rat) {
if (!(rat instanceof Array)) {
rat = undefined;
}
return rat !== undefined && rat !== null && rat.length>=0 ? [...rat] : [];
}
4.2.12.3 Possible iteration over unexpected (custom / inherited) members
Possible iteration over unexpected (custom / inherited) members, probably missing hasOwnProperty check
在对象属性(键值对)遍历时,没有hasOwnProperty验证
解决 -> 验证 :
for (let key in rob) {
if (rob.hasOwnProperty(key)) {
//操作
}
}
4.2.13 数据类型
4.2.13.1 获取数据类型
type of
typeof rat === 'number'
prototype
Number.prototype.isPrototypeOf(rat)
4.2.13.2 数据类型总结
String Number Boolean Null Undefined Symbol Object Array Function
4.2.14 滚动
4.2.14.1 回到顶部-window.scrollTo
this.$nextTick(() => {
window.scrollTo({
top: 0,
left: 0,
behavior: 'smooth'//smooth平滑,instant瞬间
})
})
4.2.14.2 回到顶部-area
4.2.14.3 滚动事件
js
window.onscroll = function () {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
let windowHeight = document.documentElement.clientHeight || document.body.clientHeight
let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight
if (scrollTop + windowHeight == scrollHeight) {
console.log('>>>>>>>>>>', "js-底部")
}
if (scrollTop <= 0) {
console.log('>>>>>>>>>>', "js-顶部")
}
}
vue
methods: {
scrolling() {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
let scrollStep = scrollTop - this.widget.oldScrollTop
this.widget.oldScrollTop = scrollTop
let windowHeight = document.documentElement.clientHeight || document.body.clientHeight
let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight
if (scrollTop + windowHeight == scrollHeight) {
}
if (scrollTop <= 0) {
console.log('>>>>>>>>>>', "vue-顶部")
}
// if (scrollStep < 0) {
// console.log('>>>>>>>>>>', "向上")
// }else {
// console.log('>>>>>>>>>>', "向下")
// }
}
}
mounted() {
window.addEventListener("scroll", this.scrolling)
},
beforeDestroy() {
window.removeEventListener("scroll", this.scrolling)
}
4.2.14.4 滚轮事件
js
window.onmousewheel = wheel
function wheel() {
var ev = ev || window.event
var down = true
down = ev.wheelDelta ? ev.wheelDelta < 0 : ev.detail >0
if (down) {
console.log('>>>>>>>>>>', "下")
}else {
console.log('>>>>>>>>>>', "上")
}
if (ev.preventDefault()) {
//阻止默认事件
ev.preventDefault()
}
return false
}
4.2.15 键盘鼠标事件
4.2.15.1 键盘
# 1 js
<input @keydown="tip3Show($event)" ></input>
tip3Show(val) {
console.log('>>>>>>>>>>', val)
if (val.keyCode === 13) { //或者 window.event
this.$message({
message: '点击回车',
type: 'success',
showClose: true
})
}
}
}
# 2 js
<input type=“text” @keyup.enter=“show()”>回车执行
<input type=“text” @keydown.up=‘show()’ >上键执行
<input type=“text” @keydown.down=‘show()’ >下键执行
<input type=“text” @keydown.left=‘show()’ >左键执行
<input type=“text” @keydown.right=‘show()’ >右键执行
# 3 vue
<el-button @click=“login”>登录
created() {
this.keyupSubmit();
},
methods(){
keyupSubmit() {
document.onkeydown = (e) => {
let _key = window.event.keyCode;
//!this.clickState是防止用户重复点击回车
if (_key === 13&&!this.clickState) {
this.login();
}
};
},
}
4.2.15 vue挂载全局$
4.3 JAVA
3 数据类型
1 引用数据类型
1、数组2、类3、接口
注:1、不同的引用可能指向同一个对象。(同一个对象可以有多个引用)
区别基本数据类型:
1、变量名指向具体的数值。
2、基础数据类型在变量声明后,立刻就会分配给他内存空间。
3、基本数据类型是分配在栈上的。
4、基础类型比较相等,可以使用 == 。(比较值相等,是不是同一个)
引用数据类型:
1、变量名指向存储对象的内存地址。
2、引用数据类型在声明后分配的是内存地址,不会分配内存。
3、引用数据类型是分配在堆上的。
4、引用数据类型使用equals方法去比较。(equals可以复写,比较相等,值是不是相同)
注:不论是基本数据类型还是引用数据类型,都会在栈中分配一块内存。
2 参数
2 形参什么时候影响实参的值
值类型:包括8种基本类型(byte、short、int、long、double、float、char、boolean)。为值类型时,形参方法内的参数值改变,不会影响到实参的值
这里要特殊考虑String,以及Integer、Double等几个基本类型包装类,它们都是immutable类型,因为没有提供自身修改的函数,每次操作都是新生成一个对象,所以要特殊对待,可以认为是和基本数据类型相似,传值操作
引用类型:数组、类、接口等类型。为引用类型时,形参方法内的参数值改变,会影响到实参的值
1 注解
1 Resource & Autowired
注解名称 | 来源 | 注入方式 | 属性 | 配合 |
---|---|---|---|---|
Resource | JDK | byName | name,type | / |
Autowire | Spring | byType | require | Qualifier |
4.1.1 事务控制注解
事务控制注解
import org.springframework.transaction.annotation.Transactional;
@Transactional(rollbackFor = Exception.class, transactionManager = "corePlatformTransactionManager")
//注意!!
不要catch异常
4.1.2 java控制台输出语句变色
/ idea console 输入语句变色
System.out.println("\033[36m" + "===========" + "\033[m"); // \033[45m \033[m ;
4.1.4 swagger注解
具体注解内参数自行研究,此处不再描述
4.1.4.1 Controller层:
类: @Api(tags = {}) //模块命名(取代card-controller)
方法: @ApiOperation(value="") //模块下边的接口备注(取代modBond)
@ApiImplicitParams({
@ApiImplicitParam(name = "domainId", value = "域ID"),
@ApiImplicitParam(name = "domainId1", value = "域ID1", paramType = "query"),
}) //1.在类上描述参数,可以包含单个String等类型参数,不可以用于对象--会把类型显 示为String
//2 paramType规定type
参数: @ApiParam(value="") //参数Parameters的描述,可以包含单个String等类型参数,也可以用于对象
//若@ApiImplicitParams和@ApiParam同时存在,@ApiImplicitParams更厉害
@Api(tags = {"行为管理 API"})
public class SupAct Controller {
@ApiOperation(value="修改行为")
public String modAct(@ApiParam(value="行为参数") @RequestBody ActVo actvo){
returen null;
}
@ApiOperation(value = "查询行为绑定关系")
public RestApiResultVo<List<ActVo>> getBond(@ApiParam("卡牌id") @Param("sCardId") String sCardId, @ApiParam("是否被占有") @Param("rat") Integer rat,@ApiParam("是否属于自己") @Param("own") Integer own) {
return supCardActService.getBond(sCardId, rat, own);
}
}
@ApiOperation(value = "查询行为绑定关系")
public RestApiResultVo<List<ActVo>> getBond(@ApiParam("卡牌id") @Param("sCardId") String sCardId, @ApiParam("是否被占有") @Param("rat") Integer rat,@ApiParam("是否属于自己") @Param("own") Integer own) {
return supCardActService.getBond(sCardId, rat, own);
}
4.1.4.2 参数类(VO)
类:@ApiModel(value = “”) //取代参数DataType下Model下 整个对象的描述(取代ActVo)
属性: @ApiModelProperty(value=“”) //对象内每个属性的描述
//!!!注意,VO不要用@Data,会导致apiModelProperty失效
4.3.1 list to map
targetTypeMap = allTargetType.stream().collect(
Collectors.toMap(
FaceTargetTypeVO::getTypeId, FaceTargetTypeVO::getCaption, (key1, key2) -> key2));
4.3.2 获取类属性
-
泛型T entity; entity.getClass).getDeclaredFields()
private <T> void playRobTd(T entity) { if (entity.getClass().isAnnotationPresent(Table.class)) { System.out.println(entity.getClass().getAnnotation(Table.class).name()); } Field[] fields = entity.getClass().getDeclaredFields(); for (Field itemF : fields) { System.out.print(itemF.getType()+"-"); System.out.print(itemF+"-"); if (itemF.isAnnotationPresent(Column.class)) { System.out.println(itemF.getAnnotation(Column.class).name() + ","); } } }
-
Class.forName(className);
4.3.4 未知返回类型处理方式
1
JSONArray array = JSON.parseArray(JSON.toJSONString(apiResultVo.getContent()));
JSONObject object = JSON.parseObject(JSON.toJSONString(apiResultVo.getContent()));
2
List<Object> list = (List<Object>) apiResultVo.getContent();
Object = apiResultVo.getContent();
3
RestApiResultVo<Map<String, String>> apiResultVo = orgService.find(orgQueryVo);
Map<String, String> map = apiResultVo.getContent();
4.3.5 lambda
在并行流(parallel stream)中,forEach()方法可能不一定遵循顺序,而forEachOrdered()将始终遵循顺序。
在序列流(sequential stream)中,两种方法都遵循顺序。
如果我们希望在每种情况下,不管流(stream)是连续的还是并行的,都要按照遵循顺序执行操作,那么我们应该使用forEachOrdered()方法。
如果流(stream)是连续的,我们可以使用任何方法来维护顺序。
但是如果流(stream)也可以并行,那么我们应该使用forEachOrdered()方法来维护顺序。
1.Stream.forEach()
forEach方法声明:
void forEach(Consumer<? super T> action)
作为此流的每个元素的使用者(Consumer)执行操作。
- 这是终端操作。
- 此操作的行为是不确定的。
- 在并行操作中,这种方法不能保证按顺序执行。
2.Stream.forEachOrdered()
forEachOrdered方法声明:
void forEachOrdered(Consumer<? super T> action)
如果流具有已定义的冲突顺序方法,则以该流的冲突顺序方法为该流的每个元素作为使用者(Consumer)执行操作。
这是终端操作。
这种方法保证了在顺序流和并行流中都按顺序执行。
3.使用序列流(sequential stream)
①在顺序流forEach和forEachOrdered中,这两个方法都将按顺序执行操作。
Stream.of("A","B","C", "D")
.forEach(e -> System.out.println(e));
输出为A B C D。
②在forEachOrderedf方法的代码。
Stream.of("A","B","C", "D")
.forEachOrdered(e -> System.out.println(e));
输出为A B C D。
如果顺序很重要,最好始终使用forEachOrdered方法。
4.使用并行流(parallel stream)
① 在并行流中forEach不保证按顺序执行。
Stream.of("A","B","C", "D")
.parallel()
.forEach(e -> System.out.println(e));
输出可能是C B A D,输出不一定是按顺序执行。
② forEachOrdered方法总是保证按顺序执行。
Stream.of("A","B","C", "D")
.parallel()
.forEachOrdered(e -> System.out.println(e));
输出为A B C D。
4.4 文档
4.4.1 git使用
4.4.2 markdown使用
4.4.3 ES使用
4.4.4 token使用
4.4.5 mybatis-plus使用
4.4.6 rabbitMQ使用
4.4.7 dos命令
4.5 解决思路
4.5.1 修改时查重
假设需互斥属性为 name
先根据id查询此条数据,表中name和参数name进行对比,如果相等(未修改name),不*查重;不相等(修改了name)则查重;
查重: 根据prop查询:根据name查询,获得list,如果list的size>0,则重复
假设需互斥属性为 name,duty
先根据id查询此条数据,表中name,duty和参数name,duty进行对比,
if (db.name != params.name) {
查重name
}
if (db.duty != params.duty) {
查重duty
}
查重name 根据name查询,获得list,如果list的size>0,则重复
查重duty 根据duty查询,获得list,如果list的size>0,则重复
4.5.2 查重和防多次点击屏障冲突问题
完善–添加修改时查重功能+防多次点击触发方法屏障 冲突问题
[屏障]为了防止异步,在弹窗弹出时设置’可点击’,在点击后触发的方法中设置’不可点击’
[重复]触发后,弹窗不关闭,导致一直不可点击,暂时的补丁:每次返回非成功状态(不关闭弹窗),都设置’可点击’
初步改进方法,(在失败时,设置可点击)
{{loadingbuttext}}
data() {
loadingbut: false,
loadingbuttext: '确定'
}
submit() {
this.loadingbut = true,
this.loadingbuttext: '加载中'
}
commit(){
设置'不可点击' //屏障
axios(res)=> {
if (成功) {
...
'关弹窗'
}
else{
设置'可点击'
if (重复) {
提示'重复'
}
if (status2) {
提示2
}
}
}
方法2: 防止异步操作
4.5.3 分页pageSizes切换时,currentPage设置为1
设置为1解决大部分问题!!!
4.5.4 表格A中绑定表B的id,删除B数据后,表A中对应字段消失
逻辑删除完美解决!!!
4.5.5 测试数据生成
- 随机数生成
- 查询其他表,返回List,在list中随机取
4.6 concept
4.6.1 DTO
网络传输对象 — 系统与外界交互的模型对象
例如:电商平台下单数据会发到OMX,ERP系统,这些对接的返回值以及入参-->DTO
4.6.2 deploy
根据定义的版本发布到对应位置(远程仓库)Release或者Snapshot 稳定和快照
ES.md)
4.4.4 token使用
4.4.5 mybatis-plus使用
4.4.6 rabbitMQ使用
4.4.7 dos命令
4.5 解决思路
4.5.1 修改时查重
假设需互斥属性为 name
先根据id查询此条数据,表中name和参数name进行对比,如果相等(未修改name),不*查重;不相等(修改了name)则查重;
查重: 根据prop查询:根据name查询,获得list,如果list的size>0,则重复
假设需互斥属性为 name,duty
先根据id查询此条数据,表中name,duty和参数name,duty进行对比,
if (db.name != params.name) {
查重name
}
if (db.duty != params.duty) {
查重duty
}
查重name 根据name查询,获得list,如果list的size>0,则重复
查重duty 根据duty查询,获得list,如果list的size>0,则重复
4.5.2 查重和防多次点击屏障冲突问题
完善–添加修改时查重功能+防多次点击触发方法屏障 冲突问题
[屏障]为了防止异步,在弹窗弹出时设置’可点击’,在点击后触发的方法中设置’不可点击’
[重复]触发后,弹窗不关闭,导致一直不可点击,暂时的补丁:每次返回非成功状态(不关闭弹窗),都设置’可点击’
初步改进方法,(在失败时,设置可点击)
{{loadingbuttext}}
data() {
loadingbut: false,
loadingbuttext: '确定'
}
submit() {
this.loadingbut = true,
this.loadingbuttext: '加载中'
}
commit(){
设置'不可点击' //屏障
axios(res)=> {
if (成功) {
...
'关弹窗'
}
else{
设置'可点击'
if (重复) {
提示'重复'
}
if (status2) {
提示2
}
}
}
方法2: 防止异步操作
4.5.3 分页pageSizes切换时,currentPage设置为1
设置为1解决大部分问题!!!
4.5.4 表格A中绑定表B的id,删除B数据后,表A中对应字段消失
逻辑删除完美解决!!!
4.5.5 测试数据生成
- 随机数生成
- 查询其他表,返回List,在list中随机取
4.6 concept
4.6.1 DTO
网络传输对象 — 系统与外界交互的模型对象
例如:电商平台下单数据会发到OMX,ERP系统,这些对接的返回值以及入参-->DTO
4.6.2 deploy
根据定义的版本发布到对应位置(远程仓库)Release或者Snapshot 稳定和快照