一、CSS写自适应大小的正方形代码：效果图：原理：元素的padding的百分比值四个值均根据当前元素的宽度来计算的padding只能取top或者bottom，自适应正方形其值要和宽一致，当然其他不同比

0. 轻量 --一个组件小于 1Kib (实际打包完不到0.8k) 今天,我们就抱着上面2个需求点,来实现一个基于vue的toast弹窗组件,下图是最终完成的效果图. 一. 先写一个普通的vue组件 二. 在我们需要使用的页面引入组件,方便看效果和错误 三. 实现动态加载组件 …

本篇的主要内容是：实现可以在命令行中，直接运行代码(下面的名字可以自己取)。 在实现自己的命令行运行代码前，你需要对命令行,npm(包管理器)的基本用法有些了解。 完成上面几个步骤之后 我们能看到生成了一个xl-cli文件夹 文件中包含一个package.json文件。 第一行…

下面可供选择的options用的是绝对定位；同时input设置了readonly，使input变的不可输入，整体布局很简单。 这两项目功能都挺简单，先来完成第一个，点击input框切换显示options，借助v-show就好。 如上所示，在选项里添加v-show="showOp…

本文主要记录一下如何基于 Vue 开发组件，并在 npm 上发布。废话不多说，进入正题 好了，到这里准备工作做好了，我们可以开始开发组件了，接着上面的例子，下面开始开发一个 switch 组件。 写的比较简单，主要还是提供思路。用习惯了开源的组件自己总得了解一下嘛，有的时候在…

前言不推荐完全copy过去,可以看看我是如何针对我这边业务;做的一个axios的封装及实现的思路需求及实现统一捕获接口报错弹窗提示报错重定向基础鉴权表单序列化实现的功能统一捕获接口报错:用的axios

1. keep-alive 2. 页面返回出现空白屏问题 这里为什么不能直接return而必须使用异步滚动操作呢？以下是个人的一些见解欢迎大家来探讨指正。 首先我们要先去了解scrollBehavior函数究竟在组件的哪个生命周期后才开始执行。这里我对组件的每个生命周期和scr…

用实例说明自定义指令怎么用

在网页的表单中，经常需要用程序来控制 input 和 textarea 的自动聚焦行为。例如我最近做的一个项目，有个装箱出库的流程，input 框自动聚焦的流程如下：页面进入时自动聚焦到订单号输入框 -> 订单号扫描完毕聚焦到商品条码输入框 -> 扫描完一个商品条码后依然停留在条码输入框 -> 所有…