qq_42683219的博客

更多优质文章查看。

一、 效果图二、 代码<template> <img ref="imgLazy" :data-src="dataSrc" :src="src" :alt="alt" :title="title" class="kh-img-lazy" @error="imgErrorHandle" ></template><script lang="ts">import { defineCompon

注意:本篇博客不讲原理，如果看不懂请先补充策略模式、状态模式、闭包、惰性求值、函数式编程等相关内容一、效果二、为什么使用策略和状态模式vue普通的tab切换很简单，使用下面代码就可以搞定。凡事就怕但是，如果使用下面的代码形式画echarts的话，切换图的时候，因为echarts获取不到宽高，导致图渲染不到页面上去。有人会说可以加this.$nexttick，是的。可以通过加入该函数做到延迟的echarts获取到dom宽高再渲染，但是需要有几个切换加几个this.$nexttick。而且有几个切换需要

一、需求1.使用浏览器localStorage，开发网站全局搜索功能。2.搜索历史不超10条，超过10条依次覆盖时间最久的历史搜索记录3.新输入的搜索记录，下次input不输入内容focus时应该展示在第一条。4.新输入的搜索记录回车搜索后，如果之前历史搜索记录中存在，下次input不输入内容focus时这把这条记录放置历史记录展示页面最上面第一条5.input 在输入内容时不展示搜索记录6. 搜索记录不能有重复值7. 一键清除大致开发思维：  使用数组队列来存储历史记

一、效果图二、echarts 股票配置根据dom 生成echarts 实例(this as any)[instance] = echarts.init(this.$refs[ref] as HTMLBaseElement); //创建实例注:instance,ref是变量需要外部传入2. 股票基础配置 import ECHARTSOPTIONSCONFIG from './config/echartConfig';//导入 /* ...... ... .. */(this a

一、场景在前端日常开发中，经常会根据返回的状态码判断进行相应的数据操作。在then中充斥着大量的if，这使代码非常耦合并且不直观（如图1.1），在以后维护中也是非常让人头疼。所以今天来优化一下代码图1.1 对请求返回的数据判断然后进行相应数据操作根据图1.1可以发现里面有多个if/else判断。可能大家会觉得图1.1里面的if/else数量还行，不需要优化，但是如果在后期中再加入多个if判断的话，then中整体的if/else会比较多。如果是自己开发的项目可以随意些，但是如果是多人开发的项目，在日后其

一、报错 ‘xxx’ only refers to a type, but is being used as a value here在Props中使用自定义类型约束时，报上面的错误。然后 我在网上查找教程，找到一个说在ts中导出class 接口，虽然没有报错，但是按照我的下面的定义，在父组件中传入data值，会报错误。那如何改动呐？export class popType { title: { name: string; nameStyle?: style; }; cont