vue
关注
分享
扫一扫
秋英之空
这个作者很懒，什么都没留下…
展开
-
vue-quill-editor的使用以及自定义tabar菜单
上一篇因为contenteditable IE的insertText 有兼容问题 ，所以重新用vue-quill-editor插件原创 2022-02-13 21:48:15 · 1277 阅读 · 0 评论 -
contenteditable富文本编辑器支持emoji插入表情
首先看下实现效果主要功能是插入表情emoji 点击顶部员工名称 可以插入员工名称到tetxarea中 ，点击face小图标可以展开表情选择注 IE有兼容性问题 不支持IE 主要是ie不持支insertText兼容问题字数限制我没有做完 方法已经提供实现<template> <div class="test"> <!-- caidan --> <div class="rich-text-area"> <原创 2022-02-13 14:04:29 · 2537 阅读 · 3 评论 -
仿elementui Cascader级联器组件编写
因公司开发需要自己类似element UI 级联器类似得组件 刚好没有封装过 只能自己动手啦原创 2021-10-15 20:54:47 · 822 阅读 · 0 评论 -
项目中的.env.development和.env.production文件是啥
项目中的.env.development和.env.production文件是啥vue项目使用.env文件配置全局环境变量关于文件名：必须以如下方式命名，不要乱起名，也无需专门手动控制加载哪个文件.env 全局默认配置文件，不论什么环境都会加载合并.env.development 开发环境下的配置文件.env.production 生产环境下的配置文件========================================================================转载 2021-09-06 20:02:13 · 1479 阅读 · 0 评论 -
vue组件中使用＜transition＞＜/transition＞标签过渡动画
vue组件中使用标签过渡动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://unpkg.com/vue/dist/vue.js"></script> <!--2. 自定义两组样式，来控制transition转载 2021-01-09 17:34:39 · 764 阅读 · 0 评论 -
vue--简易轮播图组件的实现
vue–简易轮播图组件的实现轮播图在实际开发中非常常见，这边基于vue简易写了一个swiper组件这边样式由于时间问题就随意了<template> <!-- 轮播图 --> <div class="swiper" @mouseleave="mouseleave" @mouseenter='mouseenter'> <div class="img" > <img @click="linkTo(item.linkU原创 2020-11-01 15:20:17 · 3054 阅读 · 0 评论 -
vue动态组件使用---tab选项卡
vue动态组件使用—tab选项卡tab选项卡在项目中经常使用动态组件的使用请看vue官网实例 <!-- tab --> <ul class="tab"> <li @click='tabTaggle("recommend")'>推荐</li> <li @click='tabTaggle("hh")'>人气</li> <li @click='tabTaggle("singer")'>原创 2020-10-31 22:22:43 · 648 阅读 · 0 评论 -
Vue.extend动态组件
Vue.extend 属于 Vue 的全局 API，在实际业务开发中我们很少使用，因为相比常用的 Vue.component 写法使用 extend 步骤要更加繁琐一些。但是在一些独立组件开发场景中，Vue.extend + $mount 这对组合是我们需要去关注的。Vue.extend( options )参数：{Object} options用法：使用基础 Vue 构造器，创建一个“子类”。参数是一个包含组件选项的对象。data 选项是特例，需要注意 - 在 Vue.extend() 中它必转载 2020-09-05 16:50:46 · 1320 阅读 · 0 评论 -
vue 自定义步骤条组件
<template> <div> <ul class="steps"> <li v-for="(item,index) in SetData" :key="item+index" :class="{'active':Steps===index}" >{{item+Steps}}</li> </ul> </div></tem转载 2020-06-03 21:57:43 · 2564 阅读 · 0 评论 -
vue v-loading自定义指令的实现
在实际项目中经常需要使用v-loading加载中的效果，这里使用简单的loading实现下原创 2020-05-29 23:08:39 · 1743 阅读 · 1 评论 -
封装简易的进度条组件
一 简易的进度条封装（极简版的）最近做项目时需要一个简易的进度条 ，自己动手丰衣足食 ，话不多说上代码这里是自己偷懒 使用了element UI的对话框组件子组件 progress.vue<template><div class="com"><el-dialog title="简易的进度条组件" :visible.sync="dialogVis...原创 2019-11-23 21:12:43 · 597 阅读 · 0 评论 -
vue.$nexTtick的理解
定义：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。所以就衍生出了这个获取更新后的DOM的Vue方法。所以放在Vue.nextTick()回调函数中的执行的应该是会对DOM进行操作的 js代码；理解：nextTick()，是将回调函数延迟在下一次dom更新数据后调用，简单的理解是：当数据更新了，在dom中渲染后，自动执行该函数，<t...转载 2019-08-25 21:29:06 · 151 阅读 · 0 评论 -
Vue中key值之坑
Vue中在循环数据时 key值的设置大大简化了性能 ，然而坑依然无处不在请避免给key设置数据的索引值话不多说 直接上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=de...原创 2019-07-31 20:26:10 · 1418 阅读 · 0 评论 -
V-model底层原理（important）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Com...原创 2019-08-03 21:11:17 · 482 阅读 · 0 评论 -
Vue实现简单tab栏切换
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-07-30 10:39:16 · 1173 阅读 · 0 评论