Vue3系列12--keep-alive缓存组件
有时候我们不希望组件被重新渲染影响使用体验;或者处于性能考虑,避免多次重复渲染降低性能。而是希望组件可以缓存下来,维持当前的状态。这时候就需要用到keep-alive组件。 开启keep-alive 生命周期的变化. 初次进入时: onMounted> onActivated 退出后触发 deact ...
HTML:1.初识web
认识WEB **「网页」**主要是由文字、图像和超链接等元素构成,当然除了这些元素,网页中还可以包括音频、视频以及Flash等。 **「浏览器」**是网页显示、运行的平台。 「浏览器内核」(排版引擎、解释引擎、渲染引擎) 常见的浏览器及其内核 浏览器 内核 备注 IE Trident IE、猎豹安全 ...
OpenLayers 点击显示经纬度Demo
这里给大家分享我在OpenLayers 地图开发工作中总结出的一下代码和注意点,希望对大家有所帮助 效果如下: 核心代码展示:附带讲解注释 var map = new ol.Map({ // 初始化地图 target: 'map',// 选择地图对象 layers: [ new ol.layer.T ...
JavaScript 语言入门
JavaScript 介绍 Javascript 语言诞生主要是完成页面的数据验证。因此它运行在客户端,需要运行浏览器来解析执行 JavaScript 代码。 JS 是 Netscape 网景公司的产品,最早取名为 LiveScript;为了吸引更多 java 程序员。更名为 JavaScript。 ...
Vue 3.x基础
Vue 3.x基础 模版 <template> // html </template> <script setup> // setup API // ... </script> <style> // css </style> setup API 变量(响应式) // 基本数据类型 let refVa ...
有意思的鼠标指针交互探究
今天,来实现这样一个有意思的交互效果: 将原本的鼠标指针样式,修改成自己想要的效果,并且添加上一些特殊的交互效果。 修改鼠标样式 首先,第一个问题,我们可以看到,上图中,鼠标指针的样式被修改成了一个圆点: 正常而言应该是这样: 当然,这里比较简单,在 CSS 中,我们可以通过 cursor 样式,对 ...
JavaScript中async和await的使用以及队列问题
宏任务和微任务的队列入门知识,可以参考之前的文章: JavaScript的事件循环机制 宏任务和微任务在前端面试中,被经常提及到,包括口头和笔试题 async && await概念 async 使用async关键字声明的函数,是AsyncFunction构造函数的实例,在async函数体内,可以使用 ...
浅析WebSocket(1)
简介 WebSocket 是双工的,他支持在客户端和服务器之间互相发送文本或二进制消息流,除此功能以外,它还提供了更为复杂的附加扩展: 连接协商和同源策略实施 与现有HTTP基础设施的互相操作性 面向消息的通信和高效的消息框架 这一点与Socket不同,Socket算是面向字节,他没有消息头、消息尾 ...
关于vue的一些使用总结
了解响应式原理后对代码的一点小重构 在操作一个响应式变量的时候,可能会多次去取这个响应式变量的值,这就意味着会多次执行依赖收集中的get,可以用一个局部变量缓存下来,这样只需要一次get操作. // 比如商城业务中,根据价格筛选不同的商品 data: () => ({ goods: [] }), c ...
TypeScript与JavaScript的区别
TypeScript 是一种由微软开发的自由和开源的编程语言,是一种非常受欢迎的 JavaScript 语言扩展,它也是 JavaScript 的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。它在现有的 JavaScript 语法之上加入了一层类型层,而这一层即使被删除, ...
Vue3系列11--Teleport传送组件
Teleport 是一种能够将我们的模板移动到 DOM 中 Vue app 之外的其他位置的技术,不受父级style、v-show等属性影响,但data、prop数据依旧能够共用的技术;类似于 React 的 Portal。主要解决的问题 因为Teleport节点挂载在其他指定的DOM节点下,完全不 ...
解决某些情况下 ECharts 饼图多行标签重叠问题
解决某些情况下 ECharts 饼图多行标签重叠问题 对于多行标签的重叠问题,其实一直没有一个完美的解决方案。 我能在网上查到的比较全面的解决方法就是这个:https://zhuanlan.zhihu.com/p/272710806 但我的项目中某些东西是明确的:Label的行数、字体大小、数据个数 ...