代码剑客行
在MongoDB中,简单场景是否适宜使用事务?
不适用事务的情况
* 简单操作:如果只是对单个文档进行简单的增、删、改,使用事务反而会显得麻烦。
* 高并发情况:在高并发的环境下,使用事务可能会导致锁竞争,影响性能。
* 性能要求高:如果你对性能要求很高,直接用MongoDB的原子操作(像 $set, $unset, $push 等)会更高效。
代码剑客行
关于echarts 的 tooltips数据格式化的问题?
对象的键值对都可以是字符串啊,如果不想用 "formatter" ,那就直接不用 data1 、data2
dataset: {
dimensions: ["name", "数据一", "数据二"],
source: [
{
name: "名字一",
'数据一': 1,
'数据二': 2
},
{
name: "名字二",
'数据一': 2,
'数据二': 4
}
]
},
但一般来说还是会选择 "formatter"
代码剑客行
C语言编译时出现invalid application of 'sizeof' to an incomplete type 'struct tcphdr'怎么办?
莫名其妙把-std=c11变成-std=gnu11就过了,,
代码剑客行
弹性布局 在允许 收缩,但是不允许换行的条件下 为什么没有收缩而是溢出了?
你理解错 flex-shrink 的意思了,flex-shrink: 1 的意思是收缩系数为
1。它只是个乘法里的系数,实际会收缩到多少,还要结合具体情况来看。
题中的这里其实是有收缩的,但收缩后子元素又被图片的宽度给“撑开”了。因为图片不像文本,溢出父元素以后它可以按照 "work-break"
的设置去换行。图片本身默认情况下是“不知道”该咋处理溢出的,想要让它知道,可以有两种方式:
1. 给 flex 的子元素加 "overflow: hidden"(默认是 "visible",这个应该很好理解):
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250102/3403844dc0881c2ed6c408c9d7834e9f.png)
2. 给 flex 的子元素加 "min-width: 0"(默认是 "auto",对于 div 和 img 来说其实就是 "fit-content"、也就是最小宽度等于图片原始宽度,这也是为啥你这里它不收缩的主要原因 —— 图片已经到了自己能够到的最小宽度了):
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250102/72afc148ca502fd539c30e7e54a2d4ae.png)
P.S. 这种方案同时还要给 flex 容器元素本身设置 overflow,否则最后一张图就会像图里那样溢出部分也会显示出来。
当然了,上面的方案都是从 flex 子元素入手的,像你的链接里第二个例子里那样直接给 img 设 "max-width: 100%" 也是一种解法。
***
参考阅读:
«"https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-> past-content-> size" (https://link.segmentfault.com/?enc=NnaI7l22wgIpFZoo%2FB7Xmw%3D%3D.KmGv2f1g9chbfGnzsqtXtwaK4ieQ4gy%2FV7jiZIeTT%2FePObmkoGgVVSGe0YtSS%2BfRlI3FNQ2QgDp32O4dI16mOH0XhWDrHJPHe0REqkXZDmEeu0twYckFoiTJ5aelfJ%2BW)»
代码剑客行
如何使用js实现socket通信?
试了如下代码.
var socket = new WebSocket('ws://localhost:8080');
这个代码发出后,在本地的8080端口确实收到了类似连接创建请求的数据,但之后就立刻关闭连接了,也没法进行进一步通信.
该如何做,才能在浏览器端实现和任意套接字的相互通信呢?
代码剑客行
容器内安装amh不会自动启动?
安装到Ubuntu容器中需要运行/etc/init.d/amh-start才会启动, 把/etc/init.d/amh-start放到dockerfile中的cmd 运行容器启动完程序容器会自动关闭
代码剑客行
redis-py 默认有连接池吗?
看源码解决了
"https://github.com/redis/redis-py/blob/master/redis/client.py" (https://link.segmentfault.com/?enc=rdYqSlEGvTlSMFHwd1KVTA%3D%3D.%2FQte%2FXuUxzRIDTYCo48A2mSJZaG%2FOKpKMacb%2B8IJdd9UnJOJIrOzQV4oqJAWefvJamtztUkkDjwSfPbWi2RCgw%3D%3D)
if not connection_pool:
....
connection_pool = ConnectionPool(**kwargs)
...
代码剑客行
如何让浏览器缩放后px不出现小数点?
以思否为例
缩放100%时:
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241223/cacd316f6b598925ca0cce9d74877a9a.png)
缩放90%时:
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241223/df9a3cfb8b765fb51a101ccafa5ba368.png)
有没有方法让浏览器的px为整数,不出现这种小数点的形式?
代码剑客行
极坐标下二重积分问题?
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241222/ef0cdfa83c511a592582e49b76aecfef.png)
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241222/e7a57d8f9ba8d3cc427881e06589f88c.png)
一道很简单的二重积分问题,请问大佬,不按对称性的解法,按常规解法怎么算出结果的?
我算的总是不对... 还有对称性的解法, 为什么关于y = 0对称就能推出上图的表达式。 没找到对称性关于这点的知识点。
"45a554ef38e56a64d4e534dff2566cb.jpg" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241222/6895db72b2458e7b6fb6b37870ebb550.png)
代码剑客行
sqlite记录目录信息,如果OS操作目录被修改,我怎么才能和sqlite同步数据?
有这样一个需求,就是想要使用sqlite记录目录的信息,
比如:
/aaa/bbb/ccc/
这个目录,我想要对其做sqlite记录其元信息,比如tag之类,这个好实现。
但是现在有一个场景就是,如果"/aaa/bbb/ccc"在OS中被剪切走了,或者删除了,我怎么更新我的sqlite数据呢?如何触发?或者有没有迂回的方式做到sqlite知道它被修改了?
***
因为我的程序不是一直运行状态的,所以我只能打开软件的时候进行同步。
代码剑客行
vue/uniapp中,关于数组push的问题?
正常的push数组,退出这个页面后,再进去(前后没超过10秒吧),再push(同样的方法),也能打印的出来,但是实际上就是没push进去。
watch也没反应,也不是watch的问题,因为watch关了或watch监听以外的数组都没有push进去。
把数组打印在页面里,第一次正常显示,第二次如上所述后,啥都没显示,请问下大神们该怎么解决这个问题?环境是在微信小程序里
小弟在这里先感谢各位大神们,感激不尽,祝大神们发财祝大神们取漂亮老婆
附代码,buleFound()这个方法放在onload
buleFound() {
let that = this
uni.onBluetoothDeviceFound((devices) => {
devices.devices.forEach(item => {
if(item.localName || item.name){
console.log('item',item)
if(item.localName && (item.localName).search("YiChairSmart") != -1){
if (item.advertisData) {
//这里就是用蓝牙广播包中的advertisData算出设备mac地址
let buleMac = this.ab2hex(item.advertisData);
that.chairBuleMac = buleMac.substring(buleMac.length - 12);
}
this.deviceList.push({buleMac:item.buleMac?item.buleMac:that.chairBuleMac,localName:item.localName,nickName:'智能椅',deviceId:item.deviceId,bindLoading:false})
console.log('this.deviceList',this.deviceList)
//这里能打印的出this.deviceList被push后的值,但实际上没更新
}
});
})
},
代码剑客行
C语言如何实现`tail -f`的那种效果啊?
为什么不看看tail命令的源码呢?
"https://github.com/coreutils/coreutils/blob/master/src/tail.c" (https://link.segmentfault.com/?enc=KZS7FVvkU%2B4DaRVn7Z7YEw%3D%3D.2pHhXOQmQhFkYga4xrwe0Km0Fo2uD2sbQh8Za6qwavSreyYqtEgfeHDN%2BRah6dXp9zQIb3234p0CJ9OIm8MsuA%3D%3D)
代码剑客行
react多张图片透明度依次变化实现图画如何实现?
https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241215/3b1e69e159ebdfe6565b6398797f2838.png
代码剑客行
开发后台的时候,在使用element-ui的情况,还可以使用ant-design-vue中的组件吗?
主要是想使用ant-design-vue中的treeSelect组件,element-ui的vue2版本没有这个组件,需要自己去封装!!
代码剑客行
ElementUI 中 日期选择器 type="months" 选择 多个月 或者 多个年 不生效 ?
"1697534182985.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241209/874c7b9a2e7e7f091a9cfbf4fcee777a.png)
type="months" 和 type="years" 官网案例上没问题,实际使用中下拉日期面板都不出来
代码剑客行
python项目注册nacos,健康实例数不稳定,是为什么?
没人回复,我自己来回复吧。
因为使用的是2.X版本的Nacos,所以下意识的会使用V2版本的API发送心跳,出现了上述我说的问题。
于是我把注册,发送心跳,注销的接口都改为了V1版本,似乎解决了健康实例数不稳定的问题。
这是否意味着V2版本的API有一些问题呢?官方的支持2.X版本的python sdk一直都没有,所以只能先这样了。
代码剑客行
react执行事件第一次输出一次count,后面都输出两次count?
求教,为什么第一次触发输出一次count,后面都输出两次count,GPT回答说是因为第二次以后的点击,之前的setTimeout没销毁,所以一起执行,但如果是之前的没销毁,不应该是每次点击都会加一次console么,为什么固定都是两次
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241207/bfbebf3b6c36c469977b329570c6dfd6.png)
代码剑客行
使用java写一个图片服务器,怎么设计多台服务器备份和恢复?
有个需求说是为了防止一台服务器上的图片被删,要求提供照片多服务器备份能力、
提供多服务器恢复能力。就是一个主服务器接收完图片上传后,从服务器(不确定多少台)要同步文件,然后主服务器文件删了后找不到文件要从这些同步的服务器恢复文件。该怎么去设计
代码剑客行
vue3 + TS ts类型问题?
let count:string = ref(4) //不报错 也不提示
const addCount = () => {
count.value++ //也不报错 也不提示
}
代码剑客行
为什么在F12中找不到网页中的超链接?
打了下断点,跳转是通过click事件触发的
跳转链接根据留言ID拼一下就出来了
代码剑客行
原生微信小程序有什么好的ui框架?
目前用的框架是vant,vant的小程序表单组件不尽人意,有什么好的关于表单的原生小程序框架推荐?
代码剑客行
linux 下,为什么明明存在的文件,执行却说 No such file or directory ?
你是要执行一个文件 还是切换到一个文件夹?
如果是切换到文件夹就要加cd
如果是要执行一个文件(脚本),你就vim/cat/more看一下它是什么类型的脚本
带上对应解释器命令,比如sh bash
也有可能这个路径是个空文件夹或者错误的文件,报错也有可能
或者你的环境没有配能运行这个文件的环境变量
代码剑客行
typescript如何解决对象动态获取属性并调用方法的类型定义?
可以通过 "typeof" 获取对象 "obj" 的类型,再通过 "keyof" 获取 "obj" 类型中所有 key 的集合,进而确认
"obj[type]" 的类型。
var obj = {
aaa: {
init: function () {
console.log("aaa");
},
},
bbb: {
init: function () {
console.log("bbb");
},
},
};
function fn(type: keyof typeof obj) {
obj[type].init();
}
fn("aaa");
希望有所帮助!
代码剑客行
类似 draw.io 开源免费好用的 PDF 编辑器?
查看此问题
"https://www.zhihu.com/question/388237379" (https://link.segmentfault.com/?enc=k7e3Cui2qoVxmBI0u2G%2Fpg%3D%3D.f6p8kHivBd7XHcqdigapxaQU2k%2BXhp0ZPyGfYXkrYLgKr0G0E1By6jbNrVljtNI5)
几乎都是广告
请问有类似 draw.io 开源免费好用的 PDF 编辑器吗?
代码剑客行
js要怎么实现往file对象末尾添加几个字符?
目标是想实现修改文件的hash值,所以要在文件的末尾添加一些后缀字符,如果使用FileReader的readAsArrayBuffer可以获取到文件的ArrayBuffer对象,那要怎么添加后缀数据?
代码剑客行
v-for=“item in 10“,如何倒序渲染?
v-for=“item in 10“,如何倒序渲染?我想要的结果是10,9,8,7,6,5,4,3,2,1
代码剑客行
vue正式环境如何能配置多个请求的url?
想了两个方案,一个是axios创建实例的时候就不同前缀,一个是加入拦截器改写配置。
从长远来说,还是分开比较好。
const axiosInstanceForXXX1 = axios.create({
baseURL: 'http://localhost:8001/api/',
timeout: 5000,
});
const axiosInstanceForXXX2 = axios.create({
baseURL: 'http://localhost:8002/api/',
timeout: 5000,
});
const response = await axiosInstanceForXXX1.get('/path');
const response2 = await axiosInstanceForXXX2.get('/path');
方案2
instance.interceptors.request.use(
(config) => {
let { url } = config;
// 如果 URL 以 '/module-a' 开头,则修改 baseURL
if (url && url.startsWith('/module-a')) {
config.baseURL = 'https://module-a-api.example.com/';
}
if (url && url.startsWith('/module-b')) {
config.baseURL = 'https://module-b-api.example.com/';
}
url = url.replace('/module-a/','/')
config.url = url.replace('/module-b/','/')
return config;
},
(error) => {
// 处理请求错误
return Promise.reject(error);
}
);
调用
import api from "./utils/axios.ts";
api.get('/module-a/xx')
api.get('/module-b/xx')
ps 注意代码健壮性,我就演示一下思路
代码剑客行
如何查询 kubernetes 历史各个版本的发布时间点?
解决了
可以在这里看:"https://github.com/kubernetes/kubernetes/releases" (https://link.segmentfault.com/?enc=RnPeANZ9jrLqf2GGIy4lLQ%3D%3D.CImVdPRkshP8y5%2FG5Kny%2B2jHcT0%2BBWiP1SbQg6cI79Ukaa7qfyzyAQAsd5bmmYVekrJCZOpY97dA4JALSlJXaw%3D%3D)
代码剑客行
AMH面板无法访问Mysql用户管理模块?
用的是最新的php-8.3吗,还是哪个版本,在面板『设置』的默认组件看php是哪个版本,
也可以尝试安装一个php-generic-7.4,默认组件更换成php-generic-7.4看看。
代码剑客行
java怎么处理服务订阅到期?
服务订阅,一般按年订阅。
订阅表字段:订阅状态、订阅开始日期、订阅结束日期;
订阅到期后需要将状态更新为“未订阅”,怎么检查订阅是否到期并更新状态?
* 定时任务:每天0时,那当前日期和到期日期去比较
* 监听机制
有什么更好的处理方式?哪种方式最优
代码剑客行
puppeteer如何设置请求到页面源码后,该标签的页面不继续执行,而是执行下个任务?
puppeteer如何设置请求到页面源码后,该标签的页面不继续执行,而是执行下个任务?
puppeteer如何设置请求到页面源码后,该标签的页面不继续执行,而是执行下个任务?
代码剑客行
为什么js文件也会关联 ts 的类型声明文件?
因为这是vscode内置的ts类型检查,所有js的api,都可以点击跳转到microsoft
vscode文件下的ts版本,你可以点击导航栏里的lib切换不同的es.d.ts文件查看
代码剑客行
VueRouter动态路由匹配错误?
首先捋一下顺序,你登录完成后,会跳转到home页面,动态添加路由是在跳转前还是跳转后添加的?
按照这个流程,应该是登录完成后动态添加路由,在路由跳转前会进入beforeEach函数,你可以在该函数内动态添加你需要的路由,添加完成后路由放行,进入home页面。
代码剑客行
JS可以获取某元素当前视口内的数据吗?
拿到一个需求,左右布局,左侧显示服务端返回的数据信息,右侧是接的某个第三方AI的API聊天区域。
后端和我对接的时候提的需求是左侧数据后台可能会返回Markdown、base64或者PDF,数据可能很多,高度一屏内显示不下,在右侧聊天窗口向AI提问时需要携带左侧当前视口内的数据。
现在的有两个构想,一个是左边定高 "overflow-y: scroll" 做成 "scroll-view" 的形式,另一个是左边高度自适应,右边
"sticky" 固定,哪种方法更便于实现需求呢?
现在唯一想到的笨办法是获取当前滚动高度,然后逐个获取左边每个元素的高度进行依次计算。是否有更便捷的方法呢?
代码剑客行
uniapp的小程序,如何实现手机震动?
输出一下 "fail" 信息看看呗。
uni.vibrate({
success: function () {
console.log('success');
},
fail: function (err) {
console.log('fail', err)
}
});
另外:
«OS上只有长震动,没有短震动
iOS上需要手机设置“打开响铃时震动”或“静音时震动”,否则无法震动
vibrate只适用于钉钉小程序、支付宝小程序»
所以使用看看 "uni.vibrateLong()" 和 "uni.vibrateLong" 呗。
"uni.vibrate(OBJECT) | uni-app" (https://link.segmentfault.com/?enc=imT3jR3vJmosF7wJyQLd5g%3D%3D.V5too9rbxP9dPpfVR7fSiHPPxmI0PWpVJd4uhpYJW9%2FJY5h4qqgKIQLTAqokAIjcBsdE59n%2BJHz3fcj2yw0zxA%3D%3D)
"设备/振动/wx.vibrateLong | 微信官方文档" (https://link.segmentfault.com/?enc=2aaRXt0drOc9AtdpV7vUJw%3D%3D.KHRdWSlV%2BsHu%2FeP7VS4gSu2z79WJkYm99EuRqvGVrRUI1952vXOxi53xN3Evx6buBu9fhkcxWWd8nBnWlnj%2BnAP45oSQM5GEH5u1z4MB5PzvkPqvJvc6%2BaUxNx4bsmKa)
"设备/震动/wx.vibrateShort | 微信官方文档" (https://link.segmentfault.com/?enc=W6gcqM5UAg2bBmfmm0KtkQ%3D%3D.25pXnP82NS4c%2FJfqAf1rZzAC3W9NWRh3fVnLRsNSgzaxKLIrRCnIqhb56tT9IU7NreJjfwyhTGPqQl9r6uq0peBNbRkuW3QQmSAaK8VWDlWEpboPhvDOPodX3x%2FJcKxp)
代码剑客行
node中使用request获取html文本内容编码异常的问题?
在node环境中,使用request爬取一个网页时,响应的body编码异常?
代码如下:
const request = require('request')
function getGoods () {
request('https://www.58moto.com/used-car/1470264', (err, res, body) => {
console.log(body)
})
}
getGoods()
***
浏览器中的响应:
"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241023/2434dce9ec2341e0881e793b09727231.png)
***
实际打印结果:
"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241023/5433875595209b3267ef1b8a31e42f2c.png)
实际打印部分内容:�zX����K�,�}���������:_������z檤���{��6�T=Ϛs�5Ϲ~��[~�y�g�Z��~������#��n̾<ԪO?<<���t}~�^_Zxu����B����c���CS������'��
***
这个被编码了的结果是怎么出现的?是哪种编码方式?
由于不清楚具体的编码方式,毫无头绪
代码剑客行
如何在uniapp的nvue页面中实现日期时间选择功能?
"uView UI" 的
"DatetimePicker" (https://link.segmentfault.com/?enc=soLHJPB1Cpg%2BDIrCeph0vg%3D%3D.JFMvkJCLSG9F2a33IBf3x8zfp%2BdagWUbCxgLdSdxcDbcL9G7TbTCR6LXO4l5mdbhOrczo4c0PxF%2FVTaNK2vZ2A%3D%3D)
组件我看是支持NVUE的。
"图片.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241016/2202f419567e0aa09801d334305ec91e.png)
代码剑客行
css 元素设置了10em和transition,进入后应该有放大效果么?
你像他那样,把 CSS 写到单独的文件里面,然后使用 link 标签引入,就可以复现了。
***
另外发现,直接在页面写 style 标签的话,只要触发了对应的样式计算(Recalculate Style),也是可以的。
Hello
const el = document.querySelector('.box');
// 1
getComputedStyle(el).fontSize;
// 2
console.log(el.style.fontSize);
// 3
console.log(el.offsetHeight);
.box {
font-size: 10em;
transition: 2s;
}
代码剑客行
小白对 JWT 跟 session 有些疑问,期望解惑?
* jwt的优势在于,服务端收到请求后,可以直接拿到用户的身份信息,无需再查库或者访问数据中心之类的中心化服务。反过来说,只要存在类似踢人的需求,那么 jwt 的优势直接消失,反正都要查,在请求里放一个更小的 token 去查更简单
* 所以 jwt 适合的场景其实是服务和服务之间的通信,网关获取到用户身份,做成 jwt 加到请求里,后续服务就不需要再访问用户服务这种中心服务了,而且一次请求一个 jwt,不需要考虑踢人之类的事情
* 最后说一下 session,session 就是 session,类似一个 Map,客户端发请求带着一个 key,服务端用这个 key 拿到 session。最传统的 cookie 里放 sessionid 是最简单有效的方式,类似 app 这种非浏览器环境,token 其实也是起到 sessionid 的作用,而 jwt 其实就是把’去找 session‘的操作变成了’把 session 解析出来‘的操作
代码剑客行
Ant Design Table 表格的无缝滚动怎么实现啊?
我自己写了一个无缝滚动组件,你可以拿去试一试
{
stRef.value.init();
}, 50);
2.如果需要重置滚动高度
stRef.value.scrollTop(0);
3.如果有分页,paging中的三个数据,是用来判断是否已加载完成的,如果不需要分页:paging="false"
详情
{{record[column.dataIndex]}}
const _d = reactive({
table: {
head: [
{title: '制造单位', dataIndex: 'organization_name'},
{title: '设备类别', dataIndex: 'name'},
{title: '操作', dataIndex: 'actions'},
],
data: []
},
paging: {
current: 1,
pageSize: 15,
total: 0
}
})
function search() {
_d.paging.current = 1;
_d.table.data = [];
getData();
}
function getNext() {
_d.paging.current++;
getData();
}
// 获取列表
function getData() {
d.loading = true;
let params = {
pageCurrent: _d.paging.current,
pageRows: _d.paging.pageSize,
areaCode: _d.areaCode
}
http.postAction(CLOUD_STAT+"onlineData/getCodeEquipmentList", params).then(res => {
_d.paging.total = res.rowSum; // 注意:必须要设置total
let list = res.rowDatas;
if(_d.paging.current == 1) {
_d.table.data = [...list];
} else {
_d.table.data.push(...list);
}
}).finally(() => {
_d.loading = false;
})
}
-->
{{item.title}}
{{aItem[bItem.dataIndex]}}
正在加载中
{{props.table.data.length ? '没有更多了' : '暂无数据'}}
暂无数据
import { reactive, ref, onMounted, useSlots, computed, watch } from 'vue'
import { LoadingOutlined } from '@ant-design/icons-vue';
const scrollWrapperRef = ref();
const scrollContentRef = ref();
const slots = useSlots();
const emits = defineEmits(['next']);
const props = defineProps({
// 包裹成高度
height: {
type: String,
default: '685px'
},
table: {
type: Object,
default: () => ({
head: [],
data: []
})
},
// 如果返回false,表示不分页
paging: {
type: [Object, Boolean],
default: () => ({
current: 1,
pageSize: 15,
total: 0
})
},
// 表头样式
headerTrStyle: {
type: Object,
default: () => ({})
},
// 表身样式
bodyTrStyle:{
type: Object,
default: () => ({})
},
// td样式
tdStyle: {
type: Object,
default: () => ({})
}
})
const _d = reactive({
headPr: 0
})
const notEnd = computed(() => {
return props.paging ? props.paging.current*props.paging.pageSize props.table.data.length, () => {
setTimeout(() => {
if(scrollContentRef.value && scrollWrapperRef.value) {
if(scrollContentRef.value && scrollWrapperRef.value) {
_d.headPr = scrollContentRef.value.clientHeight > scrollWrapperRef.value.clientHeight ? '3px' : 0
} else {
_d.headPr = 0;
}
}
}, 100)
}, {
immediate: true
})
onMounted(() => {
oScroll.init()
})
// 滚动对象
const oScroll = {
oWrapper: null,
oContent: null,
wrapperHeight: 0,
init() {
console.log('初始化');
oScroll.oWrapper = scrollWrapperRef.value;
if(!oScroll.oWrapper) {
return;
}
oScroll.oContent = scrollContentRef.value;
oScroll.wrapperHeight = oScroll.oWrapper.clientHeight;
// 设置滚动事件
let scrollTime = 0;
oScroll.oWrapper.onscroll = (params) => {
if(notEnd.value && oScroll.isScrollBottom(params.target.scrollTop)) {
let currentTime = new Date().getTime();
if(currentTime - scrollTime > 500) { // 0.5秒内只能触发一次
scrollTime = currentTime;
console.log('触发');
emits('next');
}
}
}
},
// 判断滚动是否触底
isScrollBottom(scrollTop) {
let contentHeight = oScroll.oContent.clientHeight;
if(contentHeight - oScroll.wrapperHeight
.t-scroll-table {
color: #fff;
display: flex;
flex-direction: column;
font-size: 14px;
.t-header {
.tr {
background: #05314A;
}
}
.t-body {
flex: 1;
height: 0;
.tr {
margin-top: 10px;
background: #07263B;
}
}
.tr {
display: flex;
.td {
flex: 1;
line-height: 42px;
padding: 0 16px;
height: 42px;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
.scroll-wrapper {
height: 100%;
overflow: auto;
&::-webkit-scrollbar {
width: 3px;
}
}
.table-tip {
margin-top: 5px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
color: #aaa;
}
下面是我在一个弹窗中使用的示例
{{oSimple.unitName(record[column.dataIndex])}}
{{record[column.dataIndex]}}
import { reactive, ref, onMounted } from 'vue'
import tScrollTable from "./modules/tScrollTable/index.vue";
import * as echarts from "echarts";
import dayjs from "dayjs";
import { CLOUD_STAT } from "@/api";
import { http } from "qlrz-service";
import {oSimple} from "@/utils/Tools.js";
const stRef = ref();
const _d = reactive({
visible: false,
areaCode: '',
table: {
head: [
{title: '制造单位', dataIndex: 'organization_name'},
{title: '设备类别', dataIndex: 'name'},
{title: '设备代码', dataIndex: 'equipment_code'},
{title: '设备名称', dataIndex: 'device_name'},
{title: '安全码', dataIndex: 'ewm'},
],
data: []
},
paging: {
current: 1,
pageSize: 15,
total: 0
}
})
onMounted(() => {
})
function open(areaCode) {
_d.areaCode = areaCode || '';
_d.visible = true;
// 初始化
setTimeout(() => {
stRef.value.init();
}, 50);
search();
}
function search() {
_d.paging.current = 1;
_d.table.data = [];
getData();
}
function getNext() {
_d.paging.current++;
getData();
}
// 获取列表
function getData() {
_d.loading = true;
let params = {
pageCurrent: _d.paging.current,
pageRows: _d.paging.pageSize,
areaCode: _d.areaCode
}
http.postAction(CLOUD_STAT+"onlineData/getCodeEquipmentList", params).then(res => {
_d.paging.total = res.rowSum;
let list = res.rowDatas;
if(_d.paging.current == 1) {
_d.table.data = [...list];
} else {
_d.table.data.push(...list);
}
}).finally(() => {
_d.loading = false;
})
}
defineExpose({
open
})
.ewm {
width: 28px;
height: 28px;
}
代码剑客行
求css自定义resize符号的方法?
"图片.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241014/622dbac9ef838c3b27720c1f93fd72f2.png)
可以,但是并不是完全可以。这些和滚动条相关的CSS属性各个浏览器的兼容力度都不太一样的。
"::-webkit-scrollbar - CSS:层叠样式表 | MDN" (https://link.segmentfault.com/?enc=bRicdcN6da0bNZ%2BSq0rcfw%3D%3D.tGqFwYAmwY0BX8aNjIQng7en3PHUDgNyEtXT24wa%2BUih0ZXm2BYxA7z%2BOoLOHFFkWyEjggLhLfqzMp%2B0kJZBq%2FpJt6vHAeJdl2Aqjy%2FzoUA%3D)
""resizer" | Can I use... Support tables for HTML5, CSS3, etc" (https://link.segmentfault.com/?enc=8oj8cM3CmpF0y6ZrrYEvuA%3D%3D.PAmFc%2Fhy4iu37gvhaRG5a4wZea9V%2BhwRhTH6PLE7h3%2FAYVBYLX%2B4yjSX2DdWkbEo)
代码剑客行
UniApp H5 项目怎么定义全局变量 ?
uni app,怎么定义全局变量,用于h5项目
看官网,都是些坑
代码剑客行
哪些资源适合存入 oss ,哪些资源则自行管理?
一个暴论:所有服务端本身不需要频繁读写的二进制内容,都无脑甩 OSS 就好了。
代码剑客行
如何在List组件中分组展示不同种类的数据?
问题现象
数据包含多个种类(例如标题、标题对应的子类等)的子数据,如何根据数据种类为ListItem设置不同的样式。
代码剑客行
CSS如何为元素销毁添加动画效果?
test
.test {
animation: fadeIn 0.5s linear;
}
如上图所示,test元素在创建时会执行动画,那如果要在元素销毁时也执行一次动画,要怎么实现?
代码剑客行
为什么SSH连接在执行脚本后会断开?
我将你的脚本稍作修改如下:
#!/bin/sh
ps
echo "currentid:$$"
echo "pid:$PPID"
{
echo "pid:$PPID"
sleep 3
kill -9 -- -$PPID
}&
sleep 5
echo "uuuuuuuuuuuuuu"
结果打印:
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241012/ca5a9cddc3c5dc629cd7e69a824ec96f.png)
其中ps部分打印:1431972和145170对应:
1431972 root 1200 S -ash
1451970 root 1192 S /bin/sh ./test.sh
kill掉的进程是"-ash",-ash 表示一个正在运行的交互式 shell, kill -9 -- -$PPID 的操作将会终止该子 shell
及其所有子进程。
代码剑客行
antd Table能实现跨列跨行合并成一个单元格吗?
const columns = [
{
title: 'Name',
dataIndex: 'name',
render: (text) => {text},
},
{
title: 'Age/Home phone/Phone',
dataIndex: 'age',
align: 'center', // 居中
render: (text, record) => { // record 获取值拼接
return `${record.age}/${record.tel}/${record.age}`
},
},
{
title: 'Address',
dataIndex: 'address',
},
];
代码剑客行
我的这段不会取消请求,请问是什么问题? axios怎么取消请求?
data = {
...data,
...JSON.parse(localStorage.getItem('_TT_token')),
cancelToken: source.token
}
axios.post(url,data)
应为
axios.post(url, data, {
cancelToken: source.token
})
代码剑客行
mysql树形结构数据筛选,叶子结点处理,如何筛选出预期数据?
为什么一定要通过sql来实现,这种属于业务逻辑的,用代码来做不是更好维护
代码剑客行
H5 页面在 安卓 8.1 系统版本中 浏览器打开获取不到数据 `status`返回`0`这种要怎么改?
感谢各位大佬的热心留言,我的问题解决了,是跨域导致的!
我在发送请求的时候添加了请求头"token,userId,Content-Type"
xhr.setRequestHeader('token', options.data.token);
xhr.setRequestHeader('userId', options.data.userId);
xhr.setRequestHeader('Content-Type', 'application/json;charset-utf-8');
此时后端通过"CORS"解决跨域问题
"9a71048f1376686ccc559ca76b3fb16.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241007/6cd68f1aedc390f75714a3ede27ad259.png)
可以看到此时"Access-Control-Expose-Headers: *"
问题正是出在这里
可以看这篇文章写的很清晰"再遇CORS -- 自定义HTTP
header的导致跨域" (https://link.segmentfault.com/?enc=EU7%2Faytjs%2FN3xDhhJ0kkJw%3D%3D.H2gMNK8MqK6fPAVB7VBEK8Tvj1UdXqVFqwNX92IVtMpuxeVMnHTn70C0whqTcx7D)
也可以参考这个问题 "参考链接" (https://segmentfault.com/q/1010000018720493)
服务端应该修改"Access-Control-Allow-Headers"中的"*"号为具体的字段
resp.headers['Access-Control-Allow-Headers'] = 'content-type,token,userId'
这里是修改后的样子,至此问题解决
"c28d8e32e45ed354267bfc585aafe61.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241007/bbca6711e1302be79690c1b49131dc80.png)