Vue
文章平均质量分 64
希文Gershwin
github仓库:https://github.com/li1164267803
北京前端程序员找工作中,有坑位可推我~~~
展开
-
h5怎么在浏览器中打开app?安卓到指定商城下载app?
h5在浏览器中打开app,到指定商城中下载app。打开app、下载app原创 2023-01-08 11:18:37 · 2776 阅读 · 1 评论 -
pc端的滚动通知组件 NoticeBar
pc端的滚动通知组件 NoticeBar原创 2022-12-06 17:17:13 · 1157 阅读 · 1 评论 -
uni.setStorageSync 和 localStorage取值 区别?uniapp存值为:{“type“:“undefined“}
在公司迁移h5项目到uniapp时,之前有很多使用存取值的场景,迁移的过程中,导致某些地方没有替换成,在取值的时候使用了出现了状态值不对的bug。原创 2022-08-28 16:58:45 · 2461 阅读 · 1 评论 -
关于微信二次分享,自定义分享参数不生效问题
在a分享给b之后,然后a打开和b的聊天记录,然后点击刚刚分享的卡片,在去分享的时候,设置的分享参数信息就失效了,在项目的app文件中记录一下当前的url路径,存储到本地,然后判断是不是ios,如果是的话,取本地的缓存地址。,安卓无问题,(b打开刚刚分享的卡片一样不行,自定义的分享参数没生效,提示失败)👆上面的文章给了我很好的思路,于是排查自己的项目问题。...原创 2022-08-16 10:33:44 · 2653 阅读 · 0 评论 -
vue 省市区三级联动 antd 级联组件 Cascader
需求 与 功能该功能实现了中国内的省市区的三级联动,基于 antd-vue 中的 Cascader 做的组件,支持原有的所有功能效果展示支持联想搜索支持显示部分省份例子(本例子是基于 antd 做的,在 element-ui,或者是 iview 中,同样适用)<template> <AreaCascader v-model="data1" /></template>API下面只列出了在本插件中二次封装添加的新字段,和部分原有 antd-v原创 2021-01-08 15:37:13 · 6897 阅读 · 10 评论 -
antd 文字溢出鼠标滑上显示,不溢出,鼠标滑上不显示tooltip
需求 与 功能该功能实现了文字过长时溢出裁切显示… 鼠标滑上使用 tooltip 显示全部内容文字少时,没有裁切,鼠标滑上不显示 tooltip在表格中使用效果展示在普通循环list中使用效果展示例子(本例子是基于antd做的,在element-ui,或者是iview中,同样适用)<template> <a-table :columns="columns" :data-source="data"> <a slot="name" slot-s原创 2021-01-05 18:01:33 · 3034 阅读 · 2 评论 -
ant-design-vue实现table序号递减和递增 排序
使用了template模板实现场景:一般在有table排序的时候出现 <!-- 序号 --> <template v-slot:num="record"> <div> <!-- 递减 --> <div v-if="data.postParams.sortOrder == 'descend'"> {{ data.total - record.index - (data.pages - 1) *原创 2020-12-17 16:18:04 · 1360 阅读 · 0 评论 -
vue项目中使用webpack多页面开发和代码分割chunk
webpack的一些基本解释webpack是一个打包工具:什么是打包呢?打包就是把源代码经过一系列处理输出为最终代码的过程,webpack官网封面就解释的很好什么是chunk(1)chunk就是打包成的一个个的块我们以前用jquery之类的开发的时候,我们的js,css等文件都是单独引入的,比如下面的代码<link rel="stylesheet" href="./bootstrap.css"><link rel="stylesheet" href="./boot原创 2020-11-04 14:01:03 · 6939 阅读 · 8 评论 -
vue组件中的方法执行顺序是怎么样的?data和props执行顺序
比如props,methods,data,watch,computed等方法的顺序是怎么样的?在vue的源码中的initState初始化方法中就有执行的一个顺序见源码 https://github.com/vuejs/vue/blob/dev/src/core/instance/state.js#L48-L62Props -》 Methods -》 Data -》Computed -》 Watch...原创 2020-07-03 19:42:02 · 2783 阅读 · 0 评论 -
vue 项目中如何使用svga,使用setText替换文本和字体大小,incorrect header check错误
前言项目需求是 ui 动画设计师给出 svga 动画,开发人员去做相应的适配,动态的去替换文字和图片的显示效果由于 ui 图形是圆形,后台返回的 img 为方形,也涉及到了使用 canvas 剪切图片,在引入图片的时候发生了 incorrect header check 错误问题效果图什么是 SVGASVGA 是一种跨平台的开源动画格式,同时兼容 iOS / Android / Web。SVGA 除了使用简单,性能卓越,同时让动画开发分工明确,各自专注各自的领域,大大减少动画交互的沟通成本,提升原创 2020-06-28 12:00:29 · 2985 阅读 · 1 评论 -
在父子组件嵌套的时候,在子组件上使用@click和@click.native的区别
/***在子组件上使用@click的时候没有效果,表示的是给子组件传递了一个自定义的方法,方法的名字叫做click,需要触发父组件的方法条件是需要在子组件中使用this.$emit('click')触发*@click.native可以给原生的子组件绑定一个父组件的方法,这样就不需要子组件$emit触发,所以使用@click.native可以直接触发父组件中的方法*/...原创 2020-05-11 10:30:37 · 1396 阅读 · 0 评论 -
在vue项目中 怎么使用driver.js做引导页
driver.js特色功能:突出显示页面上的任何任何项目 锁定用户交互 创建功能介绍 为用户添加聚焦器 高度可定制 – 可在任何地方使用,可覆盖 界面友好 – 可通过按键控制 轻量级 – gzip 压缩后只有约4kb 在所有主流浏览器中保持一致的行为 免费用于个人和商业用途安装无论你喜欢哪种方式,你都可以使用 yarn 或 npm 进行安装。yarn add d...原创 2020-04-25 15:51:51 · 2023 阅读 · 0 评论 -
前端vue的导入和导出数据
导入 <el-upload class="upload-demo" action="" :on-change="handleChange" :on-remove="handleRemove" :on-exceed="handleExceed" accept="application/vnd....原创 2020-03-18 16:36:26 · 1720 阅读 · 0 评论 -
vue中的父组件及子组件生命周期的执行顺序
一、没有任何任何显示与隐藏限制条件的情况下:1.运行的顺序依次是:父组件created→父组件beforeMounted→子组件created→子组件beforeMounted→子组件mounted→父组件mounted;二、当用v-show来控制子组件显示与隐藏的时候:1.当用v-show='show',当show的默认值为true,执行顺序同上;2.当用v-if='sh...原创 2020-03-16 10:33:27 · 7751 阅读 · 0 评论 -
swiper4以上在ios11以下报错: SyntaxError: Cannot declare a let variable twice: 't'. /static/js/vendor.a58302
vue打包时报错报错解决是引入swiper4的原因,解决方式一:降低swiper的版本,可以用3.4.2但是swiper和swiper4之间的区别挺大,这样子改又要去看swiper3的api,重新调整代码,诸多不便。解决方式二:原本的引入方式是在组件中引入:import Swiper from 'swiper'import 'swiper/dist/css/swiper...原创 2019-12-27 15:58:38 · 827 阅读 · 0 评论 -
微信浏览器中用js修改页面title
普通的html页面中通过 document.title = 'new title'; 即可修改页面的title,但是在微信浏览器中这段代码是无效的,看了些别人的博客说是“由于微信浏览器只在页面首次加载时初始化了标题title,之后就没有再监听 window.title的change事件。所以这里修改了title后,立即创建一个请求,加载一个空的iframe,由于加载后立即就移除,也不会对页面造成影...原创 2019-12-09 12:53:00 · 1078 阅读 · 0 评论 -
js(vue) 判断如何scroll滚动条开始,停止滚动?
最近接到了一个需求,滚动隐藏元素,停止显示,需要在页面中判断滚动开始和结束。使用纯原生的方法我们可以判断出滚动开始和结束,但是还是有些繁琐的。恰巧我的项目是vue的,便利用vue中的watch(侦听器)实现了这一功能,今天就以垂直滚动为例,分享一下实现方法。代码如下: export default { data() { return { ...原创 2019-12-02 18:18:22 · 5728 阅读 · 4 评论 -
vue axios请求频繁时取消上一次请求
在项目中经常有一些场景会连续发送多个请求,而异步会导致最后得到的结果不是我们想要的,并且对性能也有非常大的影响。例如一个搜索框,每输入一个字符都要发送一次请求,但输入过快的时候其实前面的请求并没有必要真的发送出去,这时候就需要在发送新请求的时候直接取消上一次请求。<script>import axios from 'axios'import qs from 'qs'exp...原创 2019-11-23 15:15:56 · 301 阅读 · 0 评论 -
使用vuex-persist苹果手机微信浏览器打开项目链接白屏
如题:苹果手机微信浏览器和电脑浏览器打开项目链接白屏,而且ie11浏览器也不能够正常打开,报错语法错误, 安卓手机却可以正常的打开链接显示?排除过程,以为是微信内置浏览器不支持,想到会不会是兼容的问题,然后使用ie浏览器查看,发现和微信是一样的情况,控制台有报错,开始处理报错。点开链接后,发现报错的是一个js文件,clss类的问题,并没有被编译考虑到,是不是在ie中一些语法,使用webpa...原创 2019-09-22 11:06:25 · 2953 阅读 · 0 评论 -
vue中使用import路由懒加载的原理、import和require的区别
import和require的区别 node编程中最重要的思想就是模块化,import和require都是被模块化所使用。遵循规范require是 AMD规范引入方式 import是es6的一个语法标准,如果要兼容浏览器的话必须转化成es5的语法调用时间require是运行时调用,所以require理论上可以运用在代码的任何地方 import是编译时调用,所以必...原创 2019-09-17 09:48:03 · 11550 阅读 · 0 评论 -
Vue调试神器vue-devtools的详细安装步骤
1、在github上打开 Vue Devtools项目https://github.com/vuejs/vue-devtools#vue-devtools2、下载压缩包3、文件解压缩4、进入压缩后的文件夹安装依赖包npm install如图:5、编译项目文件npm run build如图:编译后的目录:6、修改安装目录vue-devtools\shells\chr...原创 2019-08-20 18:08:39 · 157 阅读 · 0 评论