Vue.js
陈龙辉Break
记录技术人生。
展开
-
vue3 electron 打包后进程通信无效,开发环境正常
vue3 electron 打包后进程通信无效,开发环境却正常原创 2023-09-20 15:27:22 · 553 阅读 · 0 评论 -
移动端网页使用rem适配,在ios机型上line-height不对的问题
移动端网页使用rem适配,在ios机型上line-height不对的问题原创 2023-07-24 17:55:07 · 366 阅读 · 0 评论 -
闭包Promise.all使用方法
闭包Promise.all使用方法原创 2023-02-13 16:35:51 · 94 阅读 · 0 评论 -
移动端基于Vant组件封装底部弹出搜索多选列表
移动端基于Vant组件封装底部弹出搜索多选列表原创 2022-11-04 15:10:39 · 3122 阅读 · 6 评论 -
移动端vue使用vant上传图片并裁剪
移动端vue使用vant上传图片并裁剪原创 2022-11-04 10:16:23 · 2390 阅读 · 2 评论 -
nginx中指定路径解析至不同vue项目
nginx中指定路径解析至不同vue项目原创 2022-09-29 16:20:58 · 1574 阅读 · 1 评论 -
Vue在IE兼容模式下白屏解决方案
Vue在IE兼容模式下白屏解决方案原创 2022-09-21 14:59:22 · 1258 阅读 · 0 评论 -
el-tooltip动态内容<br />标签不解析问题
el-tooltip动态内容标签不解析问题原创 2022-06-22 21:20:25 · 1608 阅读 · 2 评论 -
Vue中使用vue-draggable-resizable实现可拖动悬浮组件
Vue中使用vue-draggable-resizable实现可拖动悬浮组件原创 2022-06-13 10:47:18 · 2026 阅读 · 0 评论 -
解决window.pageYOffset,document.documentElement.scrollTop,document.body.scrollTop获取距离顶部距离都为0的问题
在写功能需要获取并设置距离顶部距离的时候,发现:window.pageYOffsetdocument.documentElement.scrollTopdocument.body.scrollTop以上三种情况都获取不到距离顶部距离,并且在设置的时候也无效。解决办法:将父元素div上的overflow-x / overflow-y值设置为visible,或者删掉。这样就可以获取到了。...原创 2022-05-27 14:53:41 · 1437 阅读 · 5 评论 -
Flex布局在QQ浏览器中的问题
我遇到这种问题, Flex布局在QQ浏览器中父级元素滚动条无法随着子元素高度增加而出现;如图所示,子元素comment-item随着内容高度而变大时,父级元素history-comment的滚动条未及时出现,谷歌和火狐,Safari都是正常的,只有QQ浏览器有问题。解决办法:每个子元素下comment-item增加:flex-shrink: 0;这是因为默认情况下 flex-shrink 的值是 1,表示空间不够的时候等比例压缩,改成 0 就可以让愚蠢的 QQ 浏览器不做蠢事了,而其他浏览器也原创 2022-05-18 17:59:46 · 351 阅读 · 0 评论 -
Vue.js中复制图片在输入框粘贴 Ctrl+V实现上传
Vue.js中复制图片在输入框粘贴 Ctrl+V实现上传原创 2022-04-27 21:27:22 · 2373 阅读 · 0 评论 -
Vue实现点击表格单元格出现输入框,失去焦点隐藏输入框功能
Vue实现单击单元格出现输入框,失去焦点隐藏输入框功能效果如下:代码如下:<template> <div> <el-table :data="tableData" row-key="id" @cell-click="editCell" style="width: 700px;"> <el-table-column align="center" label="日期" show-over原创 2022-04-27 21:21:11 · 6971 阅读 · 0 评论 -
Vue中router-view和子路由的使用方法
语法场景:实现一个随着切换tab栏,头部底部不变,中间内容变得功能需求。首先需要在路由文件中添加子路由(children):import Vue from 'vue'import Router from 'vue-router'import Home from '../views/Home.vue'import Content1 from '../views/Content1.vue'import Content2 from '../views/Content2.vue'import Cont原创 2021-01-29 17:29:55 · 6244 阅读 · 0 评论 -
Vue在v-for循环中动态加载相对路径图片,Error: Cannot find module ‘xxx‘的问题
Vue在v-for循环中动态加载相对路径图片,Error: Cannot find module 'xxx’的问题;通过v-for来循环图片(图片是在当前项目内-相对路径)先贴出正确的代码<template> <div style="font-size: 0.15rem;"> <div class="tab"> <img :src="item.url" v-for="item in imgs" /> </div>原创 2021-01-29 16:57:02 · 1948 阅读 · 2 评论 -
Vue实现详情页返回列表页,列表页的纵向滚动条位置不变(返回上一个路由,上一个路由页面不重新加载,高度不变)
首先需要在App.vue里,把代码组件重新复制粘贴一份,且被keep-alive标签包住。且被keep-alive标签包住的加上v-if=“route.meta.keepAlive"keep−alive标签之外的的加上v−if="!route.meta.keepAlive"keep-alive标签之外的的加上v-if="!route.meta.keepAlive"keep−alive标签之外的的加上v−if="!route.meta.keepAlive”然后在列表页的文件代码里:监听离开和载入路由原创 2021-01-27 10:58:47 · 872 阅读 · 5 评论 -
vue.js打包之后,带参数的路由无法解析
vue项目做完后,未打包的时候一切正常,npm run build打包部署到服务器后却发现,带参数的路由都无法解析,出现如下界面:试了很多在百度的办法:1:修改config/index.js文件assetsPublicPath;2:修改路由模式,加上/删除 mode: ‘history’ 这句话;3:修改跳转链接的方式;…总之都试遍了还是不行;最后的解决方案如下:修改Nginx部署的配置,跟传统一样配置好之后, 增加 try_files $uri $uri/ /index.html; 这原创 2021-01-27 10:41:52 · 881 阅读 · 0 评论 -
Vue.js中使用vue-awesome-swiper轮循底部无法跳转至顶部的问题
在使用vue-awesome-swiper做轮播图的时候,发现轮播图轮播至底部的时候无法跳转至顶部。看了官方文档,有个参数是:否开启循环模式loop: true|false,写为true还是不行。最后的解决方案:原来在swiper-slide循环体的父级swiper中必须加上v-if,判断循环体数据是否为空,为空则不显示此swiper。...原创 2021-01-27 10:45:42 · 276 阅读 · 0 评论