vue.js
文章平均质量分 59
小三金
免费分享自己的小成果,因为是一个程序员儿,希望能帮到你!
展开
-
vue-显示linux日志乱码,web终端组
vue读取linux日志字符串乱码原创 2022-06-28 11:01:58 · 874 阅读 · 0 评论 -
ant design vue table合并数据项,自定义单元格内容
ant vue中table合并,且自定义单元格内容原创 2022-06-21 14:55:59 · 2151 阅读 · 0 评论 -
vue design ant confirm中的content如何写HTML
ant库的confirm组件的content选项中,如何加入html代码原创 2022-06-13 14:08:35 · 4613 阅读 · 0 评论 -
vue 读取excel内容
vue.js读取excel文件方法及组件原创 2022-06-02 14:23:37 · 8280 阅读 · 10 评论 -
转-TinyMC-VUE使用
博客(coder的自我修养)原文链接:tinymce--一款非常好用的富文本编辑器 vue集成tinymce编辑器 - coder的自我修养要注意VUE版本安装时要注意你的vue版本,具体如下:vue 3.x安装下方版本npm install tinymce -Snpm install @tinymce/tinymce-vue -S================================================================vue 2.x 安装下方版转载 2022-05-30 16:48:23 · 482 阅读 · 0 评论 -
vue子组件中使用window.onresize()只执行一次
描述:做了个简单的echarts组件,其中有个功能是当窗口变化时,刷新echarts。用了window.onresize(),且用了防抖方法,但是一个页面中会有多处用到echarts的组件,重点是当将窗口拖拽时,却只执行了一次。window.onresize = () => { delay(function () { //防抖重画 _this原创 2022-05-26 15:26:28 · 1856 阅读 · 0 评论 -
element-table修改边框颜色
ELEMENT-TABLE border原创 2022-05-17 14:48:06 · 2372 阅读 · 0 评论 -
vue 指令应用多次时,其动态值更新时,update会执行多次
前几天在开发时,心血来潮自己开发了一个v-loading指令,然后就应用到了页面中,我的页面有多处使用了该指令,但是令我EMO的时候也来了,页面很简单,只有三块区域,基本相同,但是中间有个显示后台结果的div区,我就想着,用指令来整个遮盖效果,所以,三个区域的结果区都有v-loading。v-loading指令代码如下,重点是update,也恰恰是它给我整emo了,因为,当我给v-loading重新赋值时,指令中的update居然执行了【3次】(发现问题是因为页面没有v-loading了,因为执原创 2022-04-21 09:59:40 · 3670 阅读 · 0 评论 -
vue 后台系统中多页面标签(2)增加右键菜单
先看图功能:重新写了tag标签页新增鼠标右键菜单右键菜单新增功能:关闭其它,关闭左侧,关闭右侧======================================================猥琐发育,别浪(直接代码一波)<template> <div class="menu-tags"> <template v-if="data.length != 0"> <div class="原创 2022-04-14 18:03:16 · 1713 阅读 · 0 评论 -
【转】如何用一行 CSS 实现 10 种现代布局
转自公众号:Vue社区作者:@Una Kravetshttps://web.dev/one-line-layouts/现代 CSS 布局使开发人员只需按几下键就可以编写十分有意义且强大的样式规则。上面的讨论和接下来的帖文研究了 10 种强大的 CSS 布局,它们实现了一些非凡的工作。01. 超级居中:place-items: center对于第一个“单行”布局,让我们解决所有 CSS 领域中最大的谜团:居中。我想让您知道,使用 place-items: center.转载 2022-04-14 17:50:11 · 127 阅读 · 0 评论 -
vue 后台系统中多页面标签
在后台开发中,常用一种页面标签工具,每次点击菜单栏时,会在页面区域上方增加一个【标签页】如下图,可关闭,可切换页面等功能,常见于后台管理系统中。以前,我以为这个是利用tabs组件开发的,但是后来看了一些文章才发现,它实际上跟tabs组件没有任何关系(当然你可以用tabs做,实现过程不限于任何技术)原理:1 点击菜单栏时,将【菜单项】数据记录在vuex中,或者你存本地的storage中,怎么做都行,但你得保存下来2 上方标签,通过读取我的路由链,然后用ant...原创 2022-04-13 14:27:10 · 6112 阅读 · 4 评论 -
vue2-render基础入门
vue2中的render的基础用法原创 2022-04-01 14:17:30 · 2781 阅读 · 2 评论 -
vue3 配置ant-vue的主题色
1 安装lessnpm i less --save-dev安装 less loader,注意要安装less的固定版本,因为默认安装时,会出现版本过高的错误提示,导致yarn serve无法启动npm install -D less-loader@7.x下面的错误是默认安装less,less loader时,因为版本过高所导致的错误Syntax Error: TypeError: this.getOptions is not a function2 安装 ant vue...原创 2022-02-11 17:12:20 · 1153 阅读 · 0 评论 -
50个Vue知识点
文章来自订阅号:熬夜总结50个Vue知识点,全都会你就是神!荣耀黄金1. Vue的优点?Vue的缺点?优点:渐进式,组件化,轻量级,虚拟dom,响应式,单页面路由,数据与视图分开缺点:单页面不利于seo,不支持IE8以下,首屏加载时间长2. 为什么说Vue是一个渐进式框架?渐进式:通俗点讲就是,你想用啥你就用啥,咱也不强求你。你想用component就用,不用也行,你想用vuex就用,不用也可以image.png3. Vue跟React的异同点?相同点:转载 2022-01-24 15:32:24 · 988 阅读 · 0 评论 -
qiankun.js应用
qiankun.js配置方法原创 2021-12-22 17:15:59 · 5115 阅读 · 0 评论 -
pdf.js canvas base64 中文乱码
本文请下载最新版的PDF.JS插件,并且适合自己开发界面的,且只对base64数据进行展示,真实有效最近在研究【pdf.js】读取后台传来的【base64】格式的PDF文件,用了官方的例子发现,中文居然乱码,结果如下:乱码原因,千篇一律,我也尝试过手动加载【<link rel="resource" type="application/l10n" href="./js/pdfjs/locale/locale.properties">】,说是没有字体,但发现却不行。也试过,加上一原创 2021-10-28 16:03:38 · 1350 阅读 · 0 评论 -
将现有vue项目基于electron打包成桌面应用程序
一、前言 项目本来打算采用B/S架构去做的,只是在"人群中多看了你一眼"。二、使用electron集成桌面应用 本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目打包好后打开index.html能显示网页.因为刚接触便直接拿官方demo进行打包了. 1.克隆官方demo:gitclone https://github.com/electron/electron-quick-start 2.cd electron-quick-st.转载 2021-10-08 17:18:26 · 317 阅读 · 0 评论 -
JS防抖与节流
1 什么是防抖?简单说,就是N秒内,只执行一次某方法,以防止【过度执行同一函数】而造成的内在资源浪费。// 防抖 function debounce(fn, delay) { let timer = null //借助闭包 return function() { if (timer) { clearTimeout(timer) } timer = setTimeout(fn, delay) // 简化写法 } } // 然后是旧代码 function.原创 2021-07-27 09:43:34 · 129 阅读 · 0 评论 -
vue拖拽方法,有边界控制,带吸附
Vue拖拽有很多方法,今天我用了指令去实现1创建公共指令,全局注册方式,也可以局部指令gap是附件值,也可以根据具体情况来设置// v-dragexport default { // 当被绑定的元素插入到 DOM 中时…… inserted(el) { let gap = 10 //缝隙:小于缝隙时,则吸附 let parent = el.offsetParent el.onmousedown = function(event) { var eleEvent =.原创 2021-06-29 15:16:25 · 5306 阅读 · 3 评论 -
vue工程类型—vue 多模块、vue多项目集成工程
(个人)这里 的工程类型 只有两种:单工程 项目,多工程 项目(多个子工程集成)。一、业务场景: 1、一个项目有多个子模块(子模块之间没有关系,但他们有共用的一套权限校验);对于这样的场景是可以把项目独立发布到git仓库, 但是这样又涉及到每个模块都需要独立编译好再发布,实际过程有显得有些繁琐(实际视情况而定)。一个模块就建一个git仓库,那得建立多少个仓库, 后面会加入多少个模块还不一定呢。这样肯定会带来git仓库管理上的麻烦。客户方,肯定要求 这些 同类 功能的模块,...转载 2021-05-12 11:17:39 · 4710 阅读 · 0 评论 -
axios 二进制文件流的导出下载功能
文件导出,一般都是后台整合导出业务,最终给到前台一个URL,但是有时候会遇到二进制流。这时,应该在你的Axios中设置一下 【responseType: 'blob' // 表明返回服务器返回的数据类型】,并且下载的时候要用到方法 link.href = URL.createObjectURL(blob);即可handleExport() { //导出 let _this = this _this.$http({ method: 'post', url: _this...原创 2021-05-12 10:19:22 · 436 阅读 · 0 评论 -
Ubuntu安装vue环境
1 安装vmware(VMware Workstation v16.1.1),并且安装好ubuntu(本人下载的版本:ubuntu-21.04-beta-desktop-amd64),此处自行查找。安装好系统后,并设置root密码(第一次切换,请注意root密码设置),此处自行查找方法。2 在桌面处打开终端(快捷键:ctrl+alt+t),切换成root用户,命令:su rootlinux安装软件命令:普通用户(登录用户):sudo apt-get install包名/软件包名root用户.原创 2021-04-07 23:52:01 · 4306 阅读 · 1 评论 -
VueCli生产环境打包部署跨域失败的解决
https://www.jb51.net/article/199613.htm转载 2021-04-02 11:13:18 · 283 阅读 · 0 评论 -
封装个查询条件区域组件
有时候查询页需要变化不同的样式,先看样式左右布局,且一行显示条件区,下图是一行形式点击按钮展示所有选项上代码1 condition-box.vue<template> <div :class="'condition-box ' + conditionClass"> <div class="condition-l" :style="conditionLStyle"> <slot name="condition.原创 2021-01-07 23:20:45 · 174 阅读 · 0 评论 -
封装element ui - table,支持自定义列
二次封装element ui table, 支持自定义列1 table.vue<template> <el-table :data="tableData" style="width: 100%" max-height="250"> <template v-for="(item, index) in columns"> <slot v-if="item.slot" :name="item.slot"></slot>原创 2021-01-01 22:57:13 · 1505 阅读 · 3 评论 -
vue-cli4 创建新VUE项目
为了便于 Vue 项目的管理, Vue 团队官方开发了 vue-cli 工具。本文将带您使用 vue-cli 快速创建一个 Vue 项目。本地安装 vue-cli使用 npm 全局安装 vue-cli :npm i -g @vue/cli@3.0.0-beta.6创建项目执行:vue create my-project会弹出如下界面:选择套餐此处有两个选择:default (babel, eslint) 默认套餐,提供 babel 和 es..转载 2020-12-24 21:20:57 · 201 阅读 · 0 评论 -
vue 下拉列表 干货,保证能运行
这个组件只是仿element ui select组件,实现了下拉,可以根据自己的需求改造。干货,给个赞吧!<template><divclass="vic-select"v-close><div:class="'select-value'+(isOpen?'isfocus':'')"@click="openOptions"><inputclass="select-input"v-model="value"/&...原创 2020-08-18 23:15:48 · 158 阅读 · 0 评论 -
vue 组件的V-MODEL
不玩虚的,直接上代码<template> <div class="vic-select"> <el-select v-model="val" placeholder="请选择" @change="handleChange"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> &l原创 2020-08-16 22:56:59 · 193 阅读 · 0 评论 -
vue中一个元素一个元素创建并分析内容,递归算法
需求,项目中往往用到的V-FOR基本上是固定的循环次数,或者固定的数组,但如果动态添加会如何?我的项目划分了N个页,就像WORD一样,当某页数据内容填充满了,我就得动态填加一页,并且分析新的页的有效区域是否能放r下我已有的数据内容,如果放下就不增加页了,如果放不下继续加页。最开始,我以为这不就是把 v-for='item in arr' arr动态加子项的问题吗?不过,v-for一次会重新...原创 2019-11-20 11:13:41 · 332 阅读 · 0 评论 -
vue,拖拽自定义指令
directives: { drag: { // (el, binding) inserted: function (el, binding) { var oDiv = el.children[3] var parent = el var validArea = 5 let elHeight = 0 ...原创 2019-11-13 16:36:49 · 166 阅读 · 0 评论 -
vuedraggable组件调整元素位置时,样式不跟着走——抛出的v-for的key的问题
vuedraggable,是一个拖拽换位的组件,vue2.0+组件,挺强大的,有需要的自己去搜索https://github.com/SortableJS/Vue.Draggable项目中,需要用到两个元素调换位置,并且,每个元素可以改变高度的功能。红色框可以调整其高度。好了,重点来了,当两个元素调位置的时候,我发现,样式却带不来。如下图上图是第二个改变了大小,上图是调换...原创 2019-11-09 11:44:49 · 4978 阅读 · 0 评论 -
vue proxyTable反向代理——亲测有用
proxyTable的设置网上有的是,以前也没管过,但新公司的项目需要用到,所以就彻底研究一下,结果绕了好大的弯子!注:每次设置完proxyTable,请一定要重启,刷新不好使 npm run dev!开始前,请劳记上面操作,我就在这绕了很大的弯,一直以为页面刷新就行了,但是,webpack好像很特别的存在一样,它不执行。好了,开始配置:1 打开vue项目->config-&...原创 2019-09-20 16:49:37 · 981 阅读 · 2 评论 -
Vue 生产的反向代理
关于反向代理(跨域请求),简单说,访问一个地址 http://www.a.com 传送至 http://www.b.com。常见的就是nigix去做了。但今天我想说说VUE的反向代理的玩法。重点:只有在开发VUE项目时,你才可以用到反向代理(跨域请求)。什么意思?在 config/index.js中,找到dev中的proxyTable,此项就是设置你的跨域的设置,也就是你要代理的设置...原创 2019-05-21 15:34:11 · 737 阅读 · 0 评论 -
vue引入JS的问题
问题:今天在做项目(vue)时,碰到一个老旧的问题,引入JS让我一头雾水。vue项目中,引入自定义JS,无非有两种,全局引入、单vue文件引入。无论哪种引入,首先你要了解一下import和requireimport:引入的js,必须是export出来的对象,或者常量等。require:commonJS类型对象。具体方案:一、全局式引入JS a.先准备自定义JS/...原创 2019-04-05 13:04:55 · 1264 阅读 · 0 评论 -
Vue安装时报错:npm ERR! asyncWrite is not a function 解决方案
问题:移动了VUE项目,执行npm install时,报错"npm ERR! asyncWrite is not a function"。系统:win10node版本:2019-02-13最新版本,node.js"10.15.1"安装淘宝镜像,也报错。解决方案:在确保自己的项目没有问题的前提下,卸载NODE,并安装之前项目用的NODE版本,本人之前是V9。1 卸载NODE,完全...原创 2019-02-13 16:45:08 · 4494 阅读 · 0 评论 -
axios 报错
Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource目前主流的 Vue 项目,都选择 axios 来完成 ajax 请求,而大型项目都会使用 Vuex 来管理数据,所以这篇博客将结合两者来发送请求 前言: Vuex 的安装将不再赘述,可以参考之前的博客 Vue 爬坑之路(四)—— 与 Vuex 的第...转载 2018-06-14 11:17:41 · 6157 阅读 · 0 评论 -
vue实例中的data中的值,无法更新视图
最近在研究vue.js(2.0+),然而遇到一个大炕描述:电商中,增加数量至购物车按钮:1,axios请求数据,并通过$set(target,key,value),赋值给实例data的productList属性2,页面中v-for绑定每个商品,并且,将数量默认给0等等,这个问题就来了,如何将数量默认给个0,这个购买的数量值该怎么存,由于刚开始用vue,我只能想到,将请求过来的数re原创 2017-10-21 10:38:40 · 2733 阅读 · 0 评论