![](https://img-blog.csdnimg.cn/06c295ad6e1d4bb5a0c68a5cb706ec9e.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
Vue
不知言
这个作者很懒,什么都没留下…
展开
-
antdv Select dropdownRender Input 不能输入的问题
小说明:外层 div click 事件触发select开启,然后 slot 内部 div 利用 mouseleave 属性,模拟出select 的失焦 blur 事件。简言之:外层套div,然后利用Select的open属性。原创 2023-07-26 16:36:36 · 970 阅读 · 1 评论 -
uniapp 引入 uni-simple-router 后造成 android 真机 物理返回键 退出应用的功能缺失的解决方式
【代码】uniapp 引入 uni-simple-router 后造成 android 真机 物理返回键 退出应用的功能缺失的解决方式。原创 2023-06-28 17:19:02 · 489 阅读 · 3 评论 -
百度echarts 柱状图 顶部拼接圆点效果
话不多说,简言之:原理就是,利用type="bar"的 label 能设置位置的特性,然后设置背景色、宽高、圆角等,再然后color透明即可。原创 2023-04-21 09:25:14 · 2184 阅读 · 1 评论 -
Table 合并单元格
【代码】Table 合并单元格。原创 2023-04-14 12:44:17 · 268 阅读 · 0 评论 -
Axios post from表单用法
【代码】Axios post from表单用法。原创 2023-04-10 14:00:36 · 278 阅读 · 0 评论 -
GPS:根据起终点/两地之间的经纬度,来计算两点之间的距离
【代码】GPS:根据起终点/两地之间的经纬度,来计算两点之间的距离。原创 2023-03-17 16:36:57 · 231 阅读 · 0 评论 -
uniapp input 被键盘遮挡的解决方案
在uniapp登录页遇到了input被键盘遮挡的和一点击输入框(或两个输入框来回切换输入)页面就闪现刷新的问题。闪现/刷新:用uniapp自身的。标签,替换uview的。遮挡:增加三个标签属性。原创 2023-03-16 20:42:25 · 4045 阅读 · 0 评论 -
uniapp vue renderjs 高德地图
前情提要:uniapp自带的标签实在是不好用,因此最终选择的方案,还是H5方式的高德地图。但是呢,在app端又识别不了跟dom相关的对象的,后根据文档说明,使用renderjs解决H5渲染地图的问题。原创 2023-02-01 09:26:23 · 1709 阅读 · 0 评论 -
水印效果的实现 页面打上水印 内容自定义
【代码】水印效果的实现 页面打上水印 内容自定义。原创 2023-01-05 15:31:16 · 110 阅读 · 0 评论 -
uniapp+vue move-view 拖拽滑动效果组件
uniapp自身提供了movable-area/movable-view标签实现拖拽滑动效果,但是实际开发中发现,此标签跟滚动效果有冲突,会影响内部列表的滚动效果,基于此,所以单独封装了两种模式的滑动组件。原创 2023-01-05 15:14:12 · 2141 阅读 · 0 评论 -
vue/vue-template-compiler版本不统一异常的解决方案
解决方式:将 package.json 中 vue-template-compiler 的配置修改一下,移除 ‘^’ 箭头,版本号改成跟 vue 的版本号一致即可。原创 2022-08-26 18:41:58 · 859 阅读 · 0 评论 -
vue pdf文件流 预览
PS:项目是Vue3+TS的,vue-pdf没找到ts版本的,所以换了个新的依赖。需要先将文件流处理成pdf url的格式。原创 2022-08-08 15:03:24 · 1238 阅读 · 3 评论 -
Vue Axios 请求api post方式 下载文件
VueAxios请求api下载文件。原创 2022-07-29 15:38:56 · 1530 阅读 · 0 评论 -
Ant Design Vue 组件或图标的引入和使用
AntDesignVue组件或图标的引入和使用。原创 2022-07-21 09:12:35 · 2369 阅读 · 0 评论 -
Vue template 标签不可以使用 v-show/v-for
因为v-show是通过display来控制标签进行渲染的,但是template标签在vue解析后是不会显示在页面上的,是虚拟Dom,所以无法使用v-show。但是v-if是可以使用在template标签上,因为v-if是条件渲染,只要满足v-if后的条件就可以完成渲染。......原创 2022-07-15 10:29:51 · 3920 阅读 · 0 评论 -
Vue双向绑定浅见
采用数据劫持结合发布者-订阅者模式的方式,通过ES5的 Object.defineProperty() 来劫持各个属性的 setter,getter, 在数据变动时发布消息给订阅者,触发相应的监听回调。具体的代码实现–>大神在此Vue源码采用的是ES6的Proxy API重点来了使用 Object.defineProperty 无法监听到此新增属性,而且同时无法监听数组和对象的变化,但是使用 Proxy 是可以监听到的。对比上面两段代码可以发现有以下几点不同:Vue3.0之双向绑定原理——Pro原创 2022-07-07 10:00:56 · 216 阅读 · 0 评论 -
浏览器打印
<template> <div> <img :src="imgSrc" alt=""> </div></template><script> export default { data() { return { imgSrc: '' } }, created() { this.imgSrc = localStorage.getItem('原创 2022-05-10 09:11:09 · 93 阅读 · 0 评论 -
Vue 开源类库
序号名称分类说明地址版本号1element-uiUI库饿了么基于 Vue 的桌面端组件库https://element.eleme.cn/#/zh-CN2.15.52ant-designUI库蚂蚁金融基于 React 桌面端组件库https://ant.design/index-cn3iviewUI库基于 Vue 的桌面端组件库, 不支持IE8及更低版本的浏览器https://iview.github.io/4xgplayer播...原创 2022-04-22 14:10:03 · 1524 阅读 · 0 评论 -
Vue html下载为docx/Axios post表单提交(application/x-www-form-urlencoded)
文章目录文档(下载为docx)Axios文档(下载为docx)html-docx-js:htmlDocx.asBlob();file-saver: FileSaver.saveAs(htmlDocx.asBlob(), ‘title’)例子: let originHtml = '***'; let reg = /\<table/g; let innerHtml = originHtml .replace(reg, function(result) { retu原创 2022-03-23 14:44:06 · 389 阅读 · 0 评论 -
Vue + lodash 防抖动
<template> <div> <el-input v-model="inputModel" @input="inputDebouce " /> </div><template><script>// 如果全局已引入,那么局部就不需要引入了import lodash from 'lodash'export default { // mounted方法内部亦可 created() { // 防抖动原创 2022-04-18 15:30:27 · 840 阅读 · 0 评论 -
npm install 报错/异常 解决方式
npm install 总是一言难尽,以下:特别说明:如果你 npm install 遇到奇葩问题,那么可以试试一下两种方式:1.切换成淘宝镜像或华为镜像(很多人的选择)。2.npm资源库切换成本有的(registry.npmjs.org),然后 yarn install,一般就解决问题了。3.推荐第二种方案PS:TNND,最近的工程 npm install 总是各种奇葩问题,跟同事同样的配置,本人 install 就报错,见鬼了…再说明:npm install 时,经常性的会遇到.原创 2022-03-21 13:47:06 · 4652 阅读 · 1 评论 -
Vue input的blur事件影响下拉框中点击事件的解决方案 用mousedown/mousedown替代click
最近遇到一个需求,输入框输入关键词,要出一个带输入建议的弹框,类似于ElementUI自带的,只是需求中的弹框底部有个分页功能,因此用不了自带的,只好自己写了。然后就遇到blur和click冲突的问题了…<div class="poi-element"> <el-input class="poi-input" ref="poiRef" v-model="poiKeyword" @input="poiInputDebouce" @blur="poiBlur.原创 2022-03-11 09:50:33 · 3151 阅读 · 0 评论 -
ElementUI el-autocomplete组件
PS:放入到autocomplete 组件中的数据源必须包含value字段,因为它是靠这个字段做一些逻辑处理的… <el-autocomplete placeholder="请输入POI关键词" ref="poiAutocomplete" v-model="poiKeyword" :fetch-suggestions="poiInputQueryF" :trigger-on-focus="false原创 2022-03-10 15:38:49 · 1265 阅读 · 0 评论 -
ElementUI el-table 表头错位的解决方案
当el-table固定表头且出现滚动条时,会出现表头错位。先上CSS:.el-table { th.gutter, colgroup.gutter { width: 5px !important;//此处的宽度值,对应你自定义滚动条的宽度即可 }}// 关键css代码.el-table__header colgroup col[name="gutter"] { display: table-cell !important;}当el-table原创 2021-01-22 14:19:39 · 8555 阅读 · 3 评论 -
Vue keep-alive基础用法
想使用keep-alive,必须在router和相关组件页面里面添加name属性,且名称对应,如下:Router{ path: '', component: layout , children: [ { name: 'Analysis',// 必须滴 path: '/analysis', component:()=>import('@/views/page/analysis/index.vue'), meta: { title: '', keepAlive: .原创 2021-12-23 19:46:30 · 464 阅读 · 0 评论 -
vue keep-alive不生效
理论上说,Vue的页面缓存提供了组件keep-alive,应该很简单,但实际开发中遇到alive失效的问题。初始代码,如下<keep-alive :include="includePageNames"> <router-view class="router_container" :key="$key()" /></keep-alive>// 或者(并没真实试验以下方式是否可以,参考资料有这种写法)<keep-alive > <ro.原创 2021-10-09 18:09:41 · 7880 阅读 · 0 评论 -
Vue 安装@vue/cli报错npmERR gyp ERR
周末居家,想在本地电脑安装一下Vue,却总报‘gyp’的错误,各种百度各种试,总是不行,直到看到一篇讲解:安装@vue/cli报错npmERR gyp ERR(侵删)梳理:1,首先删除本地文件夹目录 C://用户/xxx/AppData/Roaming/npm 文件夹下 vue 相关的3个文件;2,把淘宝的npm镜像源切换回npm的初始镜像源://初始源https://registry.npmjs.org/npm config set registry https://registry.n.原创 2021-09-13 11:04:10 · 1245 阅读 · 0 评论 -
Vue Vant H5 二次封装NavBar
说明: 二次封装后,方便统一管理顶部导航栏的样式或操作,如某一单页导航栏操作过于复杂,建议直接用vant的<van-nav-bar></van-nav-bar>,局部调整。<template> <div class="yourClass"> <nav-bar title="标题" :leftArrow="true" :leftText='返回' :rightText='按钮' :rigthIcon='{ ic.原创 2021-09-24 09:43:18 · 2374 阅读 · 0 评论 -
Vue H5 音频/语音录入
这里写自定义目录标题依赖安装封装组件依赖js-audio-plugin 在线文档js-audio-plugin Github地址安装npm i js-audio-recorder// 利用lamejs将pcm(wav)音频文件转化为mp3格式,详情见在线文档npm install lamejs封装组件提示:按需微调,组件代码如下:<template> <div class='yourClass'> <audio-enter :isShow='isS原创 2021-09-24 09:22:25 · 3747 阅读 · 4 评论