![](https://img-blog.csdnimg.cn/2019091813595558.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
vue项目中实战笔记--图标拖拽
小男哥、
这个作者很懒,什么都没留下…
展开
-
vue+wangeditor动态添加/删除富文本功能实现及问题解决
vue+wangeditor动态添加/删除富文本功能实现及问题解决前言: wangeditor是一个很好用的前端富文本编辑器,其功能强大,简单易上手让我这种前端小白简直爱不释手,然鹅在强大的工具或多或少都会有点小问题。今天就跟大家讲一下我在动态表单中使用它出现的问题以及最终的解决方法,有更好解决方法的大佬,欢迎不吝赐教。说明:本次案例使用的是wangeditor V3,不同版本请自行参考其官网使用文档V3官网基本用法说明: 1,安装:npm i wangeditor@3.1.1 ;2,var E原创 2020-10-15 22:52:44 · 4300 阅读 · 0 评论 -
label+input自定义文件上传功能
文件上传与已选择文件删除功能实现前言:有些时候只需要在点击一个按钮、一段文字或者一个小图标就能实现文件上传的功能,而使用封装组件的上传模块需要做很多样式方面的修改,操作起来有些得不偿失,这个时候就需要自己动手做一个简单的上传功能了。思路: 使用label标签的标记input(type为"file"),同时将input进行隐藏;点击label中的内容时即可触发文件上传,在删除已选择的文件时,在将input值改成null即可,实现代码如下:。html代码: <label for="input原创 2020-10-11 19:49:09 · 979 阅读 · 0 评论 -
vue+elementui动态表单值的绑定与校验
动态表单值的绑定与校验我们都知道,为了让使用者更简单高效的开发,vue使用了表单元素双向绑定的模式。使用时每个表单元素都会在data中对应一个写死的变量,然后通过v-model进行绑定(v-model实现原理此处不做赘述,官网讲解很到位,面试基本会问到,请自行参考)。这种用法是最常用且易上手的,但是如果需求让我们做一个统一的组件,根据后端返回的json数据动态展示成相应的input、select、textarea、radio等元素,这种情况由于数据都是不确定的,之前的方法貌似有点行不通,怎么办呢?假原创 2020-09-10 10:52:06 · 3976 阅读 · 0 评论 -
vue+elmentUi实现table列筛选动态展示功能
table列筛动态选展示功能的实现前言: 用过elementUi的小伙伴都知道,用它配合vue来写前端页面是很爽的,在大多数情况下,直接拿过来使用就能满足产品需求。就拿table组件来说,从简单的表格展示到到复杂自定义,开发者把很多可能涉及到的场景都考虑了进来。但是细心的你可能会发现,在使用table组件的时候,行是动态加载的,很多的操作都是对行进行的,而列是在一开始使用的时候要展示哪些列就写死了,如果展示的列很多,就算使用了固定列啥的冻结,用户在操作的时候依然会有很多不便,那么能不能通过筛选操作动态的展原创 2020-08-15 19:10:37 · 4405 阅读 · 16 评论 -
mac解决删除cli2报错:permission denied, access ‘/usr/local/lib/node_modules/vue-cli/node_modules/ansi-wrap‘
vue脚手架3安装及卸载vue-cli报错的解决vue cli3安装官方描述:程序包名称从更改vue-cli为@vue/cli。如果vue-cli已全局安装了以前的(1.x或2.x)软件包,则需要先使用npm uninstall vue-cli -g或卸载它yarn global remove vue-cli。Vue CLI需要Node.js 8.9或更高版本(建议使用8.11.0+)。安装:npm install -g @vue/cli由于我之前在mac笔记本上安装过脚手架2,所以要使用脚手架3原创 2020-07-26 03:15:30 · 594 阅读 · 0 评论 -
vue实现audio进度拖拽播放及拖拽播放问题解决
vue+elementUi简单实现audio拖拽播放*前言:*很久之前做过的一个录音播放功能,当时播放拖拽进度的时候出现了进度条拖到目标位置松手后又退回去的bug,现在想起来把实现过程和解决方法简单再写一遍,希望能给需要帮助的同学提供一份参考。本次小demo使用了elementUi中的slider,font-awesome中的播放图标,vue中安装及使用方法如下:npm i element-ui font-awesome -S然后在main.js中使用引入elementUi:import原创 2020-07-04 21:00:50 · 4749 阅读 · 12 评论 -
vue项目中图标可拖拽功能实现
vue项目中页面实现图标拖拽功能最近在做项目需求时有个小功能:在页面的首页增加一个快速功能按钮,用来满足操作者快速实现某一目的渴望。为了体现代码搬运工的气质与水准,当时心想,这么简单的一个小东西必须给它整的明明白白。于是在页面的左上角完美的位置fixed了一个完美的图标,并配上骚气的颜色。就在一切功能都测试完毕,静待发版部署生产环境的时候,产品告诉我,这个按钮要在所有页面都有,而不单单只在首页!...原创 2020-04-25 15:46:58 · 4570 阅读 · 5 评论