我爱了你呢
我想要写一个示例,让Child修改Parent组件的状态, 但是如何定义Child的Props的修改Parent的状态的type呢?
我想要写一个示例,让Child修改Parent组件的状态,
但是如何定义Child的Props呢?
// parent
import React, { useState } from 'react'
import Child from './child'
function Parent() {
const [msg, setMsg] = useState('111')
return (
{msg}
)
}
export default Parent
// child
import { Button } from 'antd'
import React from 'react'
type ChildProps = {
handleClick: // 这里应该如何定义呢?
}
function Child(props: ChildProps) {
return (
child
{
props.setMsg('您好')
}}>
点击
)
}
export default Child
代码如上述,如何定义ChildProps 的hanldClick的type呢?
我爱了你呢
请教一下CSS布局排列写法?
1
2
3
4
不改变HTML下如何使用flex或grid,将其排列成下列效果?
1和4自适应,2与3成上下两行,占剩余空间。
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250112/7a0f4d32f11916813e9e0eb318dc74a6.png)
我爱了你呢
leaflet调用百度地图切片数据部分公司名称地图不显示?
求教:
有些公司在百度地图上可以看见(缩放等级百度地图50米)
leaflet调取百度地图切片数据后反而看不见了是为什么呢
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/69a20615fdaa06224dfd0b88c97462c6.png)
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/6030ef0cf5d982c6914a7dc600977c62.png)
我爱了你呢
怎么在数据分析报表类的表格中显示用户信息,如:“头像+姓名”组合效果?
解决方案 Solution
推荐使用VTable组件,比较小巧易用,可以很容易的实现头像和姓名的组合显示。在VTable中可以通过两种方式实现:一种是借助icon,也是最省事的一直,icon的来源直接设置为资源field,具体可以参考我给出的demo。另外一种方式是通过自定义渲染,该方式需要熟悉这种写法,但能实现更复杂的效果,具体可以看他们官方教程。
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250104/1adf44491fc53d860e7ae0f85490b227.png)
代码示例 Code Example
const columns: VTable.ColumnsDefine = [
{
field: "name",
title: "name",
width: "auto",
cellType: "link",
templateLink: "https://www.google.com.hk/search?q={name}",
linkJump: true,
icon: {
type: "image",
src: "image1",
name: "Avatar",
shape: "circle",
//定义文本内容行内图标,第一个字符展示
width: 30, // Optional
height: 30,
positionType: VTable.TYPES.IconPosition.contentLeft,
marginRight: 20,
marginLeft: 0,
cursor: "pointer"
}
},
...
]
结果展示 Results
在线效果参考:"https://codesandbox.io/s/vtable-photo-username-ypndvm?file=/s..." (https://link.segmentfault.com/?enc=5dZRqvxADdP4fxghg97d0g%3D%3D.sxPoOok5URJHa1vTlVkBoGWWfGBC6Rl8%2Fw1ihCdft%2FiiyP7DVyPmy6fBdfVcPcx0C4T0jtK6jMR5S9yMXgmGSheStnzGI2hqMp9%2BR7UaMRs%3D)
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250104/1adf44491fc53d860e7ae0f85490b227.png)
相关文档 Related Documentation
自定义icon教程:"https://visactor.io/vtable/guide/custom_define/custom_icon" (https://link.segmentfault.com/?enc=oVMdzLdycFKS%2BfYiI%2BE9PA%3D%3D.g3JZooMTvdyibxw5A43c2mVrS6S2PMKGAOs482g2IZQgYx6oXQsYMD%2FeB4sCbZYU5u1jIzehjVweajBZwmVDzg%3D%3D)
相关demo:"https://visactor.io/vtable/demo/custom-render/custom-cell-layout" (https://link.segmentfault.com/?enc=nQ9OyUVt0XVnp2R0aG%2BQ5w%3D%3D.87EZfAMJfCOxGYaWgzRTUCOUwEYp%2Fkoz4D02DsVip1CKNWj6BiAOfZOKQReJBmw2oxUpzFhK10M7xVXZZjVZczbxsJ2tWqrV6S5rdwqz9bc%3D)
相关api:"https://visactor.io/vtable/option/ListTable-columns-text#icon..." (https://link.segmentfault.com/?enc=h5XxDTe6VcVzziKkTenDOQ%3D%3D.qySBTw%2Bj5C%2F5sIoOASJTsmWyeHCsRgqtf7HYNx0DODC68ZrZV2OecZ1YuYrXUZAe52tbAJdOk8jNyO54daV0nKsAWkKnRdxmJ0Wti8ZGRew%3D)
github:"https://github.com/VisActor/VTable" (https://link.segmentfault.com/?enc=DQXl%2FCqdS7BfelDGYB14Cg%3D%3D.ong54Rhx7duO%2FnaHpMp4cvZwp6WEkwPht7zSeCSdqVUrNLVUzexGOeF10151txFl)
我爱了你呢
为什么有了Server Sent Events,还要Push API?
除了都是服务端下发以外,两者毫无相似点……
***
SSE 的本质就是一种 HTTP 长连接。普通 HTTP 报文都是随着一方发送或接收结束(以 Content-Length 为标记)后就主动断开了,而
SSE 的报文则不会。非得对标的话也是跟 WebSocket 比。既然是 HTTP,前提就得是客户端跟服务端保持连接。
Push API 是为了配合 PWA 而提出的,它对标的是原生 App 的那种状态栏里的
Notification。它走的是浏览器内置的推送服务,并不需要你的网站跟服务端保持连接、甚至不在线都可以,就像你的 App 不需要启动也能收到通知一样。
我爱了你呢
vue项目打包部署后,页面刷新不显示,请问是什么原因影响的?
这是 "nginx" 缓存了 "index.html" 吧,这时候你里面指向的 js 文件是之前版本的,在正式已经被干掉了,你打开控制台就会有一堆找不到
js 的报错。过一段时间 "nginx" 上的 "index.html" 缓存到期了你再刷新就正常了。
我爱了你呢
使用Proxy怎么实现一个safeGet函数?
function safeGet(data) {
return new Proxy(() => {}, {
get(target, prop) {
if (data !== undefined && prop in data) {
const value = data[prop];
if (typeof value === 'function' && prop !== 'constructor') {
return value.bind(data);
}
return safeGet(value);
} else {
return safeGet(undefined);
}
},
apply(target, thisArg, args) {
if (data !== undefined) {
return data;
}
if (args.length > 0) {
return args[0];
}
return undefined;
}
});
}
// 测试
const x = safeGet({
a: 'hello',
b: { d: 'world' },
c: [-100, 200, -300],
});
console.log(x.a() === 'hello');
console.log(x.b.d() === 'world');
console.log(x.c[0]() === -100);
console.log(x.c[100]() === undefined);
console.log(x.c[100](1234) === 1234);
console.log(JSON.stringify(x.c.map((e) => e())) === JSON.stringify([-100, 200, -300]));
console.log(x.d.e() === undefined);
console.log(x.d.e('optional default value') === 'optional default value');
console.log(x.y.z.a.b.c.d.e.f.g.h.i.j.k() === undefined);
我爱了你呢
这个宏展开为什么会work?
现在有一组宏,能够在预处理阶段检测某个bool宏是否被定义,并且根据被检测的宏是否被定义来选择不同的值,这组宏的定义如下:
// macro concatenation
#define concat_temp(x, y) x ## y
#define concat(x, y) concat_temp(x, y)
// macro testing
#define CHOOSE2nd(a, b, ...) b
#define MUX_WITH_COMMA(contain_comma, a, b) CHOOSE2nd(contain_comma a, b)
#define MUX_MACRO_PROPERTY(p, macro, a, b) MUX_WITH_COMMA(concat(p, macro), a, b)
// define placeholders for some property
#define __P_DEF_0 X,
#define __P_DEF_1 X,
#define __P_ONE_1 X,
#define __P_ZERO_0 X,
// define some selection functions based on the properties of BOOLEAN macro
#define MUXDEF(macro, X, Y) MUX_MACRO_PROPERTY(__P_DEF_, macro, X, Y)
#define MUXNDEF(macro, X, Y) MUX_MACRO_PROPERTY(__P_DEF_, macro, Y, X)
#define MUXONE(macro, X, Y) MUX_MACRO_PROPERTY(__P_ONE_, macro, X, Y)
#define MUXZERO(macro, X, Y) MUX_MACRO_PROPERTY(__P_ZERO_,macro, X, Y)
但是,按照宏的展开顺序,如果在扫描的过程之中,发现宏的参数之中包含其他宏,那么首先会对参数之中的宏进行展开,随后才会展开宏本身。
所以,对于形如 MUXDEF(test, 0, 1) 的展开,应当如下:
#define test 1
int i = MUDXDEF(test, 0, 1);
// MUXDEF(test, 0, 1) -> MUXDEF(1, 0, 1) ->
// MUX_MACRO_PROPERTY(__P_ZDEF_, 1, X, Y) ->
// MUX_WITH_COMMA(concat(__P_DEF_, 1), a, b) MUX_WITH_COMMA(__P_DEF_1, a, b) ->
// MUX_WITH_COMMA(X,, a, b) ->
// CHOOSE2nd(X,,a,b) ->
理论上是展开的结果为空,但是实际展开的结果是0,是我对展开的哪一步理解有误吗?
我爱了你呢
mysql8创建用户并授权之后仍无法远程连接的原因?
在MySQL 8中,创建用户并授权后,仍无法远程连接可能有以下原因:
1. 防火墙设置:确保远程客户端(例如,从另一台计算机或服务器)可以访问MySQL服务器的网络端口。默认情况下,MySQL在3306端口上运行。如果防火墙阻止了该端口的访问,则无法建立远程连接。
2. 网络问题:确保网络连接正常,并且没有任何网络问题(如路由器、VPN或其他网络设置)阻止了远程连接。
3. MySQL配置:MySQL的bind-address配置可能限制了MySQL只能接受本地连接。默认情况下,MySQL配置为只接受localhost(本地计算机)的连接。要允许远程连接,您需要更新MySQL配置文件(通常是my.cnf或my.ini),将bind-address设置为0.0.0.0或注释掉该行。
4. 授权问题:虽然您已经创建了用户并授权,但可能出现了某些授权问题。确保您使用的用户具有正确的权限来执行所需的数据库操作。使用GRANT语句为用户授予适当的权限。
5. 密码问题:确保您在远程连接时使用的密码是正确的。密码是区分大小写的,确保您在客户端和服务器上使用相同的密码。
6. MySQL用户权限:要使用远程连接,用户必须具有适当的全局权限(例如,CREATE USER、GRANT OPTION等)。确保您创建的用户具有这些权限。
7. 服务器端日志:查看MySQL服务器的错误日志以获取有关连接问题的更多详细信息。这可以帮助您确定是否存在其他问题或错误。
8. 客户端设置:确保远程客户端(例如,使用MySQL命令行工具或GUI工具)的连接设置正确,包括服务器地址、端口、用户名和密码。
9. SELinux :如果您的系统上启用了SELinux,它可能会限制MySQL的访问权限。请检查SELinux的设置,并根据需要进行相应调整。
要解决无法远程连接的问题,您可以按照上述步骤逐一排查,并根据具体情况采取相应的措施。
我爱了你呢
ResponseEntity 文件下载,电脑下载可以正常打开,手机下载无法打开或打开乱码,这种情况是因为什么?
下载文件功能,电脑下载可以正常打开,手机下载无法打开,或者打开乱码
后台代码
HttpStatus statusCode = HttpStatus.OK;
HttpHeaders headers = new HttpHeaders();
if (download) {
String fileName = new String(r.getName().getBytes(), "ISO8859-1");
headers.add("Content-Disposition", "attachment;filename=" + fileName);
}
Resource resource = resourceLoader.getResource("file:" + path + "/" + id);
InputStream in = resource.getInputStream();
byte[] body = new byte[in.available()];
in.read(body);
ResponseEntity streamResponse = new ResponseEntity(body, headers, statusCode);
return streamResponse;
前端下载
function handleDownload(file: any) {
console.log(file)
let a = document.createElement('a')
let event = new MouseEvent('click')
a.download = file.name
a.href = file.url
a.dispatchEvent(event)
}
我爱了你呢
如何破解zip压缩包和压缩包中的文件内容?
可以使用 john the
ripper,这里有个"教程" (https://link.segmentfault.com/?enc=LHkkZPmQ0Fe%2FkHH8yZHFzA%3D%3D.%2Bs7N%2BYIerT%2Bs6EAki2NEZir2B6KG6ku6soxcf6iRzmE%3D),里面使用的是
Kali Linux 所带的"john"。
我爱了你呢
Java将数据放到缓存中,当需要从缓存中获取数据的时候获取不到?
我在项目中使用了如下代码,将一些数据放到了缓存中,当有地方需要调用getBAsset方法获取数据的时候,发现assetBuffer
中数据为空,这是什么原因呢?
当出现该问题的时候,我登录到项目部署的服务器上,查看服务器内存,发现可用内存只有100多M了,buffer内存占了3个G,服务器总内存为8个G,然后我把项目停了之后,将buffer内存清除之后,重新启动项目之后,再次调用getBAsset方法,assetBuffer是有数据的。(放入到缓存中的数据大概有16w左右)项目是用tomcat启动的,启动参数是这样配置的,给tomcat分了3G左右
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241212/274055386d0d6e1824cb735ace8ca1ae.png)
想请问大佬们,为什么会出现getBAsset方法拿不到数据呢?是因为系统内存不足了,java内存中的数据被清空了?目前还暂不考虑加redis组件,感觉加了redis组件会解决此问题
/**
* 缓存
*/
@Component
@Order(1)
@Slf4j
public class ScenarioBuffer implements IActionListener, ApplicationRunner {
/**
* 资产缓存
* 系统启动时初始化,当资产增删改时,同步更新它;
*/
private static Map> assetBuffer = Collections.synchronizedMap(new HashMap>());
private static ScenarioBuffer instance = new ScenarioBuffer();
public static ScenarioBuffer getInstance() {
return instance;
}
/**
* 从缓存中获取资产
*
* @param groupId
* @return
*/
public static List getBAsset(String groupId) {
if (assetBuffer.containsKey(groupId)) {
return assetBuffer.get(groupId);
}
return null;
}
@Override
public void run(ApplicationArguments args) throws Exception {
IAssetService assetService = SpringUtil.getBean(IAssetService.class);
List assetList = assetService.list();
assetBuffer.put("key",assetList);
}
}
我爱了你呢
如何使用一个网站的认证功能限制另一个服务的访问?
已知
1. 我有一个自己写的博客系统,vuejs+spring全家桶的项目,有完整的用户访问权限功能,可以通过"http://myblog.cn" (https://link.segmentfault.com/?enc=y%2FmIZXX9bCx7QmaIxL3UvQ%3D%3D.DQrf2nuQ1y%2BnYmHPLapXDdzLl4eHeru4Vj9jrd3Ihgg%3D)访问。后面为了叙述方便,记为S 。
2. 我有好几个提供其它功能的服务网站,比如其中一个提供了一个供人消遣的小游戏,可以通过myblog.cn:8001访问,当然还有可能有8002,8003...,这些小服务都没有认证的功能,而且可能是开源项目,并不知道用什么技术开发的,只是跑在我的服务器上的一个网站。后面为了叙述方便,记为a,b,c... 。
问:
我如何将a,b,c分别嵌入到S中,实现打开S中的一个页面,就打开了a。
限制条件
就向在S的页面中嵌入一个iframe,但是我希望实现的是只有登陆了我的博客的人才能访问。你可能回答,限制那个网页的访问权限不就行了嘛,问题是,一旦打开了,用户就会知道里面嵌入的是myblog.cn:8001,以后直接通过myblog.cn:8001就可以访问了,就跳过我的系统了。
所以,最好的情况是,我压根不向外部网络暴露8001端口,而通过什么技术转发到到我的博客页面上,只有通过我的网站后台才能访问到这些服务。
我自己知识有限,可能思考的方式不太对,想知道正常情况下是如何实现的,请大佬赐教。
我爱了你呢
正则表达式 $在这里是匹配啥?
就是排除$ . 下划线 跟数字
$单纯指代 $字符
我爱了你呢
VUE3 Object.assign 获取想要的字段?
let tenant = {}
let data = tenantList.data.find(item => item.id == id);
for (let key in data) {
delete data["status"] // 删除会覆盖的同名状态字段
if (form.hasOwnProperty(key)) { // 只取form需要的
tenant[key] = data[key]
}
}
Object.assign(form, tenant);
我爱了你呢
css有没有办法实现这种形状?
"https://codepen.io/chauncywu/pen/eYbqOQr" (https://codepen.io/chauncywu/pen/eYbqOQr)
我爱了你呢
有没有类似于可以测量客户端发出http/https请求并得到响应过程中性能效率相关指标的软件?
可以测量响应时间,服务器处理时间等等性能效率相关联的指标
我爱了你呢
vue2插槽里的默认内容没有显示,这是为什么?
这是依赖包的内容,有看到某金一篇文章说,vue和vue-template-compiler版本不一致,但是我重装了依赖包,然后看了一下lock文件里,装的都是最新的vue版本。请问问题在哪。
{
"name": "tr-template",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve ",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"lint-staged": "lint-staged",
"prepare": "husky install"
},
"dependencies": {
"@jxcc/tr-component-base": "^1.0.6",
"@jxcc/tr-plugin-api": "^1.0.6",
"@jxcc/tr-plugin-request": "^1.0.6",
"axios": "^0.27.2",
"clipboard": "^2.0.0",
"codemirror": "^5.38.0",
"core-js": "^3.8.3",
"countup": "^1.8.2",
"cropperjs": "^1.2.2",
"dayjs": "^1.10.6",
"decimal": "^0.0.2",
"decimal.js": "^10.4.3",
"echarts": "^5.4.2",
"element-ui": "2.13.2",
"jquery": "^1.12.4",
"lodash": "^4.17.21",
"mockjs": "^1.1.0",
"normalize.css": "7.0.0",
"screenfull": "^5.0.2",
"vue": "^2.6.12",
"vue-pdf": "^3.3.1",
"vue-router": "^3.2.0",
"vue-virtual-cascader": "^1.3.16",
"vuedraggable": "^2.23.2",
"vuex": "^3.4.0",
"vuex-persistedstate": "^4.1.0",
"vxe-table": "^3.6.13",
"xe-utils": "^3.5.7"
},
"devDependencies": {
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@commitlint/cli": "^17.0.2",
"@commitlint/config-conventional": "^17.0.2",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-plugin-vuex": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"compression-webpack-plugin": "^5.0.1",
"connect": "^3.6.6",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-vue": "^8.0.3",
"husky": "^8.0.1",
"lint-staged": "^13.0.0",
"monaco-editor": "^0.20.0",
"prettier": "^2.6.2",
"sass": "^1.26.5",
"sass-loader": "^8.0.2",
"svg-sprite-loader": "^5.2.1",
"terser-webpack-plugin": "^4.2.3",
"vue-template-compiler": "^2.6.12",
"webpack": "^5.72.1",
"worker-loader": "^3.0.8"
}
}
默认插槽是这么写的
点击上传
只能上传word、pdf、excel、jpg、png等文件格式,单个文件不超过100M
我爱了你呢
Vue.js在开发大型应用程序时如何处理路由和状态管理?
Vue.js在开发大型应用程序时如何处理路由和状态管理?
我爱了你呢
单点登录的问题?
简单说A系统再跳转B系统之前,先找到相关联用户然后请求B系统的登录或者相关鉴权接口,在B系统完成登录鉴权的操作,拿到登录凭证;之后A系统前端携带凭证跳转往B系统,B系统前端拦截到凭证请求相关接口拿到登录信息
我爱了你呢
关于electron依赖包问题?
镜像源切换回 "https://registry.npmjs.org/" 应该就可以解决问题了。
另外 "npm.taobao.org" 已经停用了,请切换到 "registry.npmmirror.com"
"阿里云开发者 - 淘宝 NPM 镜像站切换新域名啦" (https://segmentfault.com/a/1190000040936469)
***
Edit 10/31
应该是淘宝镜像的问题,早期的版本只同步了 "electron/v7.3.3" 的目录,缺少了没有前缀 "electron/7.3.3/ "的目录。👉
"docs: change China mirror domain to npmmirror.com by fengmk2 · Pull Request
#32076 ·
electron/electron" (https://link.segmentfault.com/?enc=EPfJtZSOTSEeYeWsA7Rhyg%3D%3D.%2BUNxFC26NQW0V6pblp1PpsTpiGedGDP5Kdnm9X2hWU4Wl3a1gk1o%2BzWAunSjz3B3OzUMc1XHhPbOEjmO%2BKV1Z88MBomFYeaNFDjJ5B4Nr0g%3D)
所以切换回 "npmjs" 的源应该可以解决这个问题,但是可能会有网络问题。
文档按照中说的解决方案可以手动增加一个 "ELECTRON_CUSTTOM_DIR" 的环境变量 "Path" 设置为 "v{{ version }}" 可以解决问题。👉 "自定义镜像和缓存 | Electron" (https://link.segmentfault.com/?enc=PsF9nDhHVuBSUS4vt%2F8vsw%3D%3D.aaQZn7s2NHE2g4%2Bmy6PSj0fzp72e1V2clPTCi2kHl0qh2BRbNAMgdZmuVmT7fQoDLlDOpJMYm0qBoe8N%2BRlrQKnKifXqZ4XWbavI2WelQnfhTHnNR2Hf8B7s2lnoGpRcnkfwE9UfimUgELOTpZ4uVhomqh1hKlVXVWv%2Fvbi7XgW9p8gd5sDHmKk5ID4ckDPz)
当然手动到
"/electron/v7.3.3/" (https://link.segmentfault.com/?enc=8AGXvYT42x7aUEN%2BlythyA%3D%3D.AIZZ45YwczfyFNERmWTEhiBEsr8emlSi8A3JMtMwrLUvpFPZiY4nanuDrbHJwtYcmCpnv%2Fyicl4yQTFFHyivcs9Wno6ONC8BbkeJ3HIVq4Q%3D)
目录下载对应的文件,然后放到 "electron" 的缓存目录中也可以解决问题。
我爱了你呢
如何实现表单循环渲染?
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241127/9790d46d7e391d0d52d0ac170fd40d97.png)
根据表格的表头循环渲染表单,但是输入框绑定的值要如何循环
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241127/7fa9774e8afe7393aa85413878a2aed3.png)
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241127/b2784579785e4bee26a994569ddfc5b3.png)
我爱了你呢
ts提示文件不在files中?
重启vscode就没有提示了,不知道为什么
我爱了你呢
css相对定位或导致元素宽度不一样了?
感觉是定位 和百分比的 有关系, 父元素加上 "position: relative;" 或者百分比换成 px 就没问题了
我爱了你呢
单元格编辑功能,如何修改v-if绑定的条件,实现只有某几个字段可编辑。?
{{ row[item.prop] }}
cellDoubleClice: false,
cellRowIndex: null,
cellLabel:''
// 遍历出所有表格行的回调函数
tableRowClassName({ row, rowIndex }) {
// 给row添加索引
row.row_index = rowIndex;
},
// 双击事件触发的函数
cellDblclick(row, column, cell, event)
this.cellDoubleClice = event.bubbles;
// 用列字段名称作为列的唯一标识
this.cellLabel=column.label
// 获取点击单元格的行索引
this.cellRowIndex = row.row_index;
},
如何修改v-if绑定的条件,实现只有某几个字段可编辑。
我爱了你呢
Vue组合式API生命周期插入组件的实现方法?
useTest.js :
import { onMounted } from 'vue';
export function useTest() {
onMounted(() => {
console.log('组件挂载后的 onMounted 钩子被调用');
});
}
另一个 Vue 组件里引入:
// MyComponent.vue
import { useTest } from './useTest';
export default {
setup() {
useTest();
// 其他 setup 逻辑...
},
};
JS 来模拟:
// 模拟 Vue 的 onMounted 钩子
function onMounted(callback) {
// 模拟 Vue 的挂载过程
document.addEventListener('DOMContentLoaded', callback);
}
// 自定义组合函数
function useTest() {
onMounted(() => {
console.log('模拟的 onMounted 钩子被调用');
});
}
// 在模拟的组件挂载时调用 useTest
useTest();
我爱了你呢
求zepto下能运行的lazyload懒加载靠谱插件?
求zepto下能运行的lazyload懒加载靠谱插件
如题,谢谢!
我爱了你呢
如何根据A数组将B数组组装为新数组?
let A = ['A', 'B', 'C']
let B = [
['1A'],
['2A','2C']
]
根据 A 数组将 B 数组组装一个新数组
newArr = [
['1A', null, null],
['2A', null, '2C']
]
我要的新数组
newArr = [
['1A', null, null],
['2A', null, '2C']
]
我爱了你呢
为什么three.js地图在部署后不显示?
根据代码this.addMapGeometry(jsondata)
反正真正的地图点是后边的函数,只需要把json传递给下边函数就行了,就不按照原本给的方法加载了,直接使用require 将json传递给下级就完了
目前没有发现问题。是否有隐患不知道
// 加载地图数据
loadMapData(str) {
// https://datav.aliyun.com/portal/school/atlas/area_selector
this.resetInitMap()
// const loader = new THREE.FileLoader()
// loader.load(`/static/json/${str || 'china'}.json`, (data) => {
// const jsondata = JSON.parse(data)
// this.addMapGeometry(jsondata)
// })
let jsondata = require(`@/assets/json/${str || 'china'}.json`)
this.addMapGeometry(jsondata)
},
我爱了你呢
neo4j docker镜像 bitnami/neo4j 怎样设置内存大小呢?
"- "./conf:/bitnami/neo4j/conf""
你这个错了吧,你应该
" "./conf/neo4j.conf:/bitnami/neo4j/conf/neo4j.conf" "
这样应该就行了
我爱了你呢
spring boot能否监听到rabbitmq消费者退出了?
"ConnectionListener"中有"onShutDown"方法,可以在"ConnectionFactory"中通过"addConnectionListener"方法加载,但有必要吗?它不是自带断线重连的功能吗?
我爱了你呢
electron 嵌套 react如何做前端存储?
使用 electron 嵌套 react开发项目,如何实现前端数据离线缓存,数据较多且对读取速度有要求。pouchDB 能否满足要求,使用
pouchDB写了 demo,每次 electron 重启后,数据就没了。
有没有其他比较成熟的方案,最好这种缓存可兼容 web 端,web 也会独立部署(非必要)
我爱了你呢
原型和原型对象到底指的是什么?它们是一样的吗?
对象的原型是一个原型对象。
看 ecma262 的用法,大概是,对象有原型 (object t's prototype);类型有原型对象 (Function prototype
object, String prototype object, 还有 Object prototype object, 等等)。
t=new T; ,t 的原型是 T 原型对象。
***
在
"ecma262" (https://link.segmentfault.com/?enc=yDJYXiWSkzhc2AoqRhQxKw%3D%3D.%2FAaAkCva3WdmFYCYulave7eCkZdItfBObBqSuhC6xP0%2F45vKSS0ayT6ggCDu%2ByRY9H3w4T6bZ790MixQ2MEXQw%3D%3D)
里,对 prototype 有一句说明:
«Every object created by a constructor has an implicit reference (called the
object's prototype) to the value of its constructor's "prototype "
property.»
对所谓 prototype object 是没有定义的,只是一个习惯叫法。(但是对 Object prototype object, Function
prototype object 等具体对象是有定义的。)感觉大概就是构造函数的 prototype 属性里的那个 object 叫 prototype
object 。
看你引文的用法,跟 ecms262 是不一致的。但是了解 js 的继承机制的话,基本也可以明白是怎么回事,不会对理解带来什么障碍。
***
英文就已经乱了的话,中文就更不好统一了。
我爱了你呢
创建Apple Distribution时提示我超过最大数了创建不?
在这里试一下 [revoke
certificates](https://link.segmentfault.com/?enc=qmJLU1a4TbUJixG6tF4mIg%3D%3D.dharioGlOgzZo8gxy%2FN164ZWXnrZMD%2F8xdT4VaZ0Obf%2FXakf86UPGDIqOioFmW2n%2BvKeI6Acp3gixgjaQAD4b70GVnMIhJEhy3bCrGsDtyntg1WN40LUA5W9prNIzgDv)
我爱了你呢
main.go里 为什么不能访问其他文件里的变量?
同一级目录下,不同文件中的可访问变量是不需要 "import" 文件的形式去访问的,直接就可以用。
比如:
.
├── main.go
├── go.mod
├── go.sum
└── cal.go
"cal.go" 里面有一个 "FactorialClosure",那 "main.go" 中就直接可以用:
package main
import "fmt"
func main() {
fmt.Println(FactorialClosure)
}
我爱了你呢
想了解一些react设计原理这种更深入一些的知识读什么书比较好?
其实我一直觉得"只看书"是最容易丢掉兴趣的学习方式,除非写的真的很通透,但市面上很多书都很拉跨,像"《Vue.js设计与实现》"这种书少之又少,需要花很多时间去筛选
看"源码"是比较不错的辅助方式,但看源码需要有方法,在对一个"开源库的架构"没有清晰的认知之前,直接看源码也属于自爆。
像 "React"
这种体量的框架,可以先通过阅读一些优质文章,博客去了解它的"组成部分,工作流程",然后选择一个自己感兴趣的部分去过一遍源码,如果你的知识储备能支撑你阅读源码,你会发现在
"兴趣驱动 + 正向反馈" 加持下,效率会比你去书里面扣别人的解释高出几个量级
并且客观来说,"React" 和 "Vue" 两门框架从架构学习的门槛上来说,React 确实要比 Vue
更高,虽然这两个框架都是在解决相同的问题,但架构确完全不同
"React"中涉及到很多对于前端同学来说比较生疏且晦涩难懂的概念,像"协调"(fiber,Diff算法),"调度"(优先级,lane模型,时间切片)甚至像
hooks 引入的"代数效应"等数学模型,所以本身阅读 "《React设计原理》" 这本书就有不低的门槛,能坚持看下去的人很少,所以评价没有那么重要,况且
"React" 不像 "Vue"国内有霍春阳大佬这样的贡献者,能把 "React" 研究明白的也没几个人
就目前现状而言,"《React设计原理》" 的作者 "卡颂" 至少是持续在做这件事的人,可以先看看之前他写的 "React技术揭秘",或许对你有帮助
"https://react.iamkasong.com/" (https://link.segmentfault.com/?enc=aH8YrbNJLAZjMUF6z0O3Yg%3D%3D.Ibezf3vB2Gi5RflFu71KjDcb9Dticd7%2Bx540XtMuqsY%3D)
我爱了你呢
js关于函数参数和实参是什么关系?
今天偶然被朋友问到一个问题,推翻了自己以往的认知。
const a= [1,2,3];
function test(x){
console.log(x===a)// 控制台输出 true
x=[2,3,4]
console.log(a); // 依旧为[1,2,3]
console.log(x); //变为[2,3,4]
};
test(a);
问题:
1. 为什么变量 a 没有被更改为 [2,3,4]呢?
2. 函数在执行的时候 形参 x 和实参 a 是什么关系呢?
我爱了你呢
html2canvas 性能优化方案有哪些?
我目前用的方案是将 PDF 文件嵌入到页面中,然后使用浏览器的打印功能来打印页面
代码大致如下:"详细代码" (https://segmentfault.com/a/1190000023936932)
"demo" (https://link.segmentfault.com/?enc=trLFX929KUoV8Z2u3YQl2A%3D%3D.ECHWp5r0UkqwuOCapzCDjh%2B%2BDbElAvnr%2FhdVFwA1wUCA1l8JSqzH7o%2F9QmjaoNn5)
function loadpdf() {
axios({
method: 'get',
url:
'./20200714144950101.pdf',
responseType: 'blob',
}).then(function (response) {
let blob = new Blob([response.data], { type: response.data.type })
let url = URL.createObjectURL(blob)
document.getElementById('iframe').src = url
})
}
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241008/28ed7a7e35d1b0cd0e6e8a7514f286f3.png)
***
如果你的预览页面有样式要求,你可以用"pdf.js"去进行渲染和打印操作。
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241008/cbfcf2d105f53780c47185a3e08c3916.png)
"demo" (https://link.segmentfault.com/?enc=XpE%2FLTuGjYnAdgb7wqhh3A%3D%3D.kHAQrvqdFMhFTXRNx8Wavtj967JabEcjC3OzDjzQlOa5ElLjzL%2FqfPXaIYhvynJM7vC9nqYmdFAae7%2FuAtQiIw%3D%3D)
源码直接右键网页源代码
我爱了你呢
git第2次合并内容不更新?
问题背景:
项目中有两个分支: test、master
比如有a文件: 在test和master分支 内容是不相同的
执行以下命令
git checkout master
git merge test
合并的时候有冲突,处理冲突时错误地用了master分支的a文件内容,所以造成master分支的a文件内容不是我想要的,想要的是test分支的a文件内容。
尝试1:
再次merege
执行如下命令
git checkout master
git merge test
此次merge的时候没有冲突提示,但是master分支的内容也没更新上,提示为已经是最新代码。
尝试2
在master分支上基础上新建一条master-bugfix分支,然后在master-bugfix分支更改a文件内容。然后执行如下git命令
git checkout master
git merge master-bugfix。
问题解决。
但是尝试2不够优雅,新增了一条新的分支且可能会有其它未预期的问题。
疑问:
1. 为什么第二次合并,master分支的a文件内容没有更新;
2. 除了尝试2,还有其它更好的方法处理这种情况吗?
我爱了你呢
MySQL中学号字段类型选择:int还是char?
这取决于你得学号的组成呀,如果是纯数字,当然优先选择数字类型,但不是 int 而是 bigint。
如果包含了数字以外的字符,那个人建议,也是先考虑 varchar。
其次要注意的是,如果你的字段类型是 varchar 这类字符串类型,而查询的时候如果使用数字(省略引号)进行查询,将会走不到索引。
我爱了你呢
CSS创建不规则div的方法?
你F12你的网页看看?
大概率用css3d变换即可
"https://codepen.io/643104191/pen/jORBNgo" (https://codepen.io/643104191/pen/jORBNgo)
我爱了你呢
这是哪个jquery框架来着,一时想不起来了?
像是"extjs"
我爱了你呢
java 的多线程问题 ?
https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241006/9eb16f45d6b7b57196e37a900ce50b3c.png
如图所示, 位置 2 和位置3 为什么可以访问 位置1 (也就是主线程)的 point 局部变量 ?
毕竟 位置 2 和位置3 是另外两个线程啊 !!
https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241006/a5c727139f9972f068d0ba99cfdcee6f.png
当我加上 第10行代码后,thread1 和 thead2 中都不能访问主线程中的point 了。我知道这是内部类的“事实最终变量” 的限制。
https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241006/dfe17e63ffb3fdf2646a5aafb2f766e8.png
https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241006/b893dc59e77a935056f2b85f3b8eacb5.png
如下图所示,就是我不理解的地方。(在**“栈内存”** 层面)
https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241006/a6a373a63b5714f9abc1bec72055dc19.png
我的猜测:之所以 thread1 和 tread2 这两个新的线程并没有初始化 point 这个变量 但是还能使用的原因是因为 Runnable
的两个实现类 内部都各自 生成了一个 point 实例变量 ? (虽然书上的解释是针对局部内部类,针对外面的方法执行完毕局部变量就不复存在的原因,
但是我不知道 多线程 能不能也可以同样这样解释)。
我爱了你呢
pymongo 怎么插入北京时间的字符串?
我现在有北京时间的字符串
2023-12-25 10:31:32
通过"datetime.datetime.strptime(2023-12-25 10:31:32, "%Y-%m-%d %H:%M:%S")"转换,pymongo插入到mongodb。mongodb默认插入的是utc时间的,怎么才能插入是北京时间的?
我爱了你呢
AMH解决 HTTP 429 错误:Too Many Requests?
429是请求数过多被amh.sh前端节点屏蔽了,像一些在一两分钟内访问几百次的不正常访问就会被拦截了。
或是提供ip后10位数这边排查看。
我爱了你呢
php中生成了一个excel文件,用ajax怎么接受?
jQuery 版本太老了,v3.x 之前不支持 Blob、ArrayBuffer,居然还在用 1.12。
要么升级,要么别用 $.ajax 而是自己单独写个方法。
我爱了你呢
Antd Design Pro ProForm组件数据转化convertValue应该怎么使用呢?
Antd Design Pro 中的 ProForm组件数据转化convertValue, transform 怎么使用呢?
表单项中使用了ProFormDigitRange,
组件值是一个数组,后台服务器接收的是字符串,所以我需要在提交和表单初始化时转化这个值。但是失败了,在表单输入时就报错了,是我理解错了这个用法吗?
{
console.log('value', value);
return (value && value.includes('~')) ? value.split('~') : [];
}}
transform={(value, f) => {
console.log('tranfrom', value);
return value && value.length > 0 ? { depRange: value.join('~') } : '';
}}
/>
convertValue, transform 在表单初始化时都执行了,所以我写的转化逻辑就报错了,应该怎么使用呢?
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241005/b315236ef0e97cf390285ad1fd6e2b3e.png)
我爱了你呢
Chrome Devtools开发者工具如何保存Websocket连接的所有 message?
我前几天也有个大概的需求,我是项目内引用debugout.js进行记录的,可以把记录的日志下载下来
我爱了你呢
Vue3无法通过ref获取盒子的dom?
问题已解决:
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241004/0cccb512e5a5eb65d011d1dc2ef50634.png)
我爱了你呢
网不好的情况下图片从上到下断断续续的渲染怎么解决?
网不好的情况下图片从上到下断断续续的渲染怎么解决?