李瀚 - 官方网站

前言“图片懒加载”，这个词语想必大家再熟悉不过了。传统的实现方法是，监听scroll事件，获取img元素相对于视口的顶点位置el.getBoundingClientRect().top，只要这个值小于浏览器的高度window.innerHeight就说明进入可视区域，当图片进入可视区域时再去加载图片资源。 这种方法的缺点是，由于scroll事件密集发生，计算量很大，容易造成性能问题。 目前浏览器API中的 IntersectionObserver 交叉观察器，可自动"观察"目标元素与根元素的交叉区域的变化，以此判断元素是否可见。利用这个方法，在观察到元素可见时，再去加载图片资源。这样“图片懒加载”实现起来就很容易了。 当然浏览器的观察器，不仅IntersectionObserver这一种。下面我们依次介绍下浏览器5种观察器的基本用法，以及它们的应用。 首先来看一下，什么是浏览器的观察器？ 一、什么是浏览器的观察器？针对一些不是由用户直接触发的事件，比如DOM元素从不可见到可见、DOM大小、属性的改变和子节点个数的修改等，浏览器提供特定的api去监控这些变化，这些api就是浏览器的观察器 ...

简介说到前端开发，就一定离不开npm，作为前端包管理的老大，npm是我们必须知道的一个东西。 虽然每天都用npm安装包，但是你们对package.json和package-lock.json这两个文件又了解多少呢？今天笔者就来详细分析下这两个文件，希望能对大家有所帮助。 在说 package.json和package-lock.json之前我们先来说说 npm 安装包都有哪些方法。 package.json和package-lock.json生成方式package.json不会自动生成，需要我们使用命令创建。package-lock.json是自动生成的，我们使用 npm install 安装包后就会自动生成。 下面我们介绍下怎么创建package.json。 npm 为我们提供了创建 package.json 文件的命令 npm init，执行该命令会问几个基本问题，如包名称、版本号、作者信息、入口文件、仓库地址、关键字、描述、许可协议等，多数问题已经提供了默认值，你可以在问题后敲回车接受默认值。 基本问题问完之后 npm 会在生成文件之前把 package.json 文件内容打出来 ...

Make the development of API services faster and more efficient (Only for springboot)1、If you want to use request uniform responseIntroducing dependencies to your pom.xml 12345<dependency> <groupId>com.lihansir.platform</groupId> <artifactId>lihansir-spring-boot-starter</artifactId> <version>${latest version}</version> </dependency> click here to find the latest version Alternate link Just need two annotation 12@EnableRestResult ...

  1、@CrossOrigin注解解决跨域 123456@GetMapping("/hello")@ResponseBody@CrossOrigin(value = "*")public String hello() { return "hello";} 2、接口编程 123456789101112@Configurationpublic class WebConfigurer implements WebMvcConfigurer { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedHeaders("*") .allowedMethods("*") .allowCredentials(true) .allowedOriginPatterns("*") ...

1、注册一个Encoder的Bean 1234567891011121314151617181920212223@Configurationpublic class FeignClientFormPostConfig { private ObjectFactory<HttpMessageConverters> messageConverters; // new一个form编码器，实现支持form表单提交 // 注意这里方法名称，也就是bean的名称是什么不重要， // 重要的是返回类型要是 Encoder 并且实现类必须是 FormEncoder 或者其子类 @Bean public Encoder feignFormEncoder() { return new FormEncoder(new SpringEncoder(this.messageConverters)); } @Autowired public void setMessageConverters(ObjectFactory<HttpM ...

介绍根据文档介绍，包的链接分为两步。 第一步在一个包文件夹内执行 npm link 将在全局文件 {prefix}/lib/node_modules/ 内，创建一个符号链接（symlink），这个链接指向 npm link 命令执行的地方。 第二步到其它目录下，执行 npm link packageName 命令，将会创建一个从全局安装的 packageName 到当前文件内的 node_modules 下的符号链接。 需要注意的的是， packageName 是取自包的 package.json 中 name 字段，不是文件夹名称。 包的名称可能有作用域前缀，如果有， packageName 也要对应加上。 实践基于文档，结合实际的操作，对照看下产生的效果。 运行环境 项目是基于 webpack 简单配置，本地运行的 server 。 node 使用 nvm 管理的。 项目已引用了包 ...

oracle exp/imp数据备份 1、Oracle11g默认对空表不分配segment，故使用exp导出Oracle11g数据库时，空表不会导出。 解决办法：设置deferred_segment_creation 参数为FALSE后，无论是空表还是非空表，都分配segment。 在 sqlplus 中，执行如下命令： SQL>alter system set deferred_segment_creation=false; 查看： SQL>show parameter deferred_segment_creation; 注：该值设置后只对修改后新增的表产生作用，对之前建立的空表不起作用。 2、下面介绍的是导入导出的实例。 数据导出： 增加参数：statistics=none 可以避免导出问题数据 将数据库TEST完全导出,用户名system 密码manager 导出到D:daochu.dmp中 exp system/manager@TEST file=d:daochu.dmp full=y 将数据库中system用户与sys用户的表导出 exp system/mana ...