- 博客(128)
- 收藏
- 关注
原创 获取本地json文件
获取本地JSON文件请求报404错误,原因是vue-cli3.0之后创建的项目静态资源都放在了根目录下的public目录下,因此需要将json文件建在public目录下即可。
2022-09-17 15:02:22
5891
转载 element的el-table组件,在插槽slot=“header“内,数据不更新的问题
element的el-table组件,在插槽slot="header"内,数据不更新的问题
2022-09-14 10:15:34
3143
1
转载 38 个非常有用的 JavaScript 单行代码汇总
关于JavaScript的单行代码技巧,我们在前面也分享过一些,但是,没有今天齐全,今天分享的这些代码,基本都是我们日常开发中会使用到的一些单行代码。
2022-09-02 17:37:39
204
转载 Vue2项目报错:Uncaught SyntaxError: Unexpected token <
报错F5刷新 运行 Vue 项目时,发现报了一个 Uncaught SyntaxError: Unexpected token ‘<’ 错误,如图解决方案vue.config.js 文件其实不是代码的问题,而是资源公共路径设置的问题,解决方法如下:...
2022-04-21 16:05:38
2006
原创 vue2 后端做好导出功能,前端导出 Excel表 (下载excel权限限制处理) - 将blob返回值转换为json格式
/** * @param {Object} obj 导出Excel表 后缀:suffix * 导出功能:vue下载excel权限限制处理 exportExcel * 下载excel但是需要传token来验证的问题,一般情况下是用直接指向地址来实现,但是token校验没办法实现,所以就用到了blod */export const exportExcel = (data, fileName, suffix = '.xlsx') => { // console.log(dateFormater
2022-04-18 18:12:38
1389
原创 面试题(2022)
网页中有大量图片加载很慢 你有什么办法进行优化?1.图片懒加载,在图片未可视区域加一个滚动条事件,判断图片位置与浏 览器顶端和页面的距离,如果前者小鱼后者,优先加载2.使用图片预加载技术,将当前展示图片的前一张和后一张优先下载3.使用 csssprite 或者 svgsprite行内元素/块级元素有哪些?行内元素:相邻的行内元素会排列在同一行,不会独占一行 设置宽高无 效 span 块级元素:会独占一行 可以设置宽高等属性 div 可变元素:根据上下文预警决定该元素为块元素还是内联元
2022-04-12 10:59:38
336
转载 Vue 项目重复点击菜单刷新当前页面
场景最近在项目开发过程中,项目经理提了一个需求:在当前页面点击当前页面对应的(左侧)菜单时,也能刷新页面。由于 Vue 项目的路由机制是路由不变的情况下,对应的组件是不重新渲染的。所以重复点击菜单不会改变路由,然后页面就无法刷新了。解决方案: 借助重定向利用一个空的 redirect 页面,通过判断当前路由是否与点击的路由一致,如果一致,则跳转到 redirect 页面,然后在 redirect 页面重定向回跳转之前的页面。这样就实现了页面刷新了。1.创建一个空的页面:src/layout
2022-04-09 11:14:47
1841
2
转载 【cascader出现的报错】Error in callback for watcher “options“: “TypeError: Cannot read properties of null
动态cascader级联选择器动态cascader级联选择器,发现切换数据源的时候报错,网上看到这个文章完美解决https://blog.csdn.net/weixin_43043994/article/details/100303097问题怎么出现的上面文章写的很清楚,解决方法就是重新加载组件。两个方法一个加v-if,一个加key<el-cascader :key="keyValue" //keyValue在data中定义,初始值为0 clearable :props=".
2022-02-14 13:58:21
6581
1
原创 【iconfont】字体图标
【iconfont】字体图标使用<!-- 这个css是我引用阿里的一些字体图标,请戳: https://www.iconfont.cn/ --><link rel="stylesheet" href="http://at.alicdn.com/t/font_1117508_wxidm5ry7od.css"><!-- 消息外层容器,因为消息提醒基本上是全局的,所以这里用id,所有的弹出消息都是需要插入到这个容器里边的 --><div id="message-
2022-01-12 16:40:25
531
原创 倒计时 - 项目
效果图代码String s1;String s2;String s3;long hour = time / 3600;s1 = hour > 9 ? String.valueOf(hour) : "0" + hour;long minute = time % 3600 / 60;s2 = minute > 9 ? String.valueOf(minute) : "0" + minute;long sec = time % 3600 % 60;s3 = sec >
2021-12-14 18:31:10
236
原创 添加滚动条效果
方案一elementUi - 固定表头height="500"方案二效果图:<div class="infinite"> 内容 ... </div>// 设置Y轴滚动条.infinite{ // width: 800px; height: 500px; overflow-y: scroll;}
2021-11-18 15:55:42
222
转载 el-table 空单元格填充自定义内容
效果图代码<el-form-item label="满额包邮" class="AddStore-box-item"> <el-input v-model="form.fullQuota" placeholder="请输入多少元" /> <el-tag :hit="false" size="medium" color="#fff">元</el-tag></el-form-item><el-table-column prop="
2021-11-10 18:09:53
1293
原创 用 el-switch 显示状态
<el-table-column prop="state" label="状态"> <template #default="{row}"> <el-switch :value="row.state === 0" active-color="#13ce66" /> <!-- el-switch 可以 v-model 绑定一个布尔值 但是现在我们没有布尔值, 也不需要双向绑.
2021-11-10 14:26:59
718
转载 程序员必逛的网站
搜索&翻译Google https://www.google.comGoogle翻译 https://translate.google.cn互联网科技资讯36氪 https://36kr.com爱范儿 https://www.ifanr.com雷锋网 https://www.leiphone.com虎嗅 https://www.huxiu.com极客公园 http://www.geekpark.net代码托管、协作开发Github https://github.co
2021-11-04 17:14:09
162
转载 Element Backtop回到顶部的具体使用
解决element-ui el-backtop返回顶部组件无效问题el-backtop绑定的盒子,需要一个滚动样式:overflow-y: scroll;<template> <div id="app"> <router-view /> <!-- 绑定app盒子 --> <el-backtop target="#app" :visibility-height="100" /> </div><
2021-11-04 14:40:51
1061
1
原创 数组find和findIndex的区别
<script> // 模拟购物车列表数据 const cartList = [ { goods_id: 11, goods_name: '商品1' }, { goods_id: 33, goods_name: '商品3' }, { goods_id: 22, goods_name: '商品2' }, { goods_id: 44, goods_name: '商品4' }, { goods_id: 66, goods_n
2021-09-25 16:35:55
77
原创 通过every计算购物车的全选状态
<script> // ### every 每一项 // ```js // const 布尔值 = arr.every(item => 条件); // ``` // MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/every // 注意点:
2021-09-25 16:33:00
196
原创 JS实现继承的几种方式
借用构造函数实现继承function Parent1(){ this.name ="parent1"}function Child1(){Parent1.call(this); this.type ="child1";}缺点:Child1无法继承Parent1的原型对象,并没有真正的实现继承(部分继承)借用原型链实现继承function Parent2(){ this.name ="parent2"; this.play = [1,2,3];}funct
2021-09-12 20:47:01
98
原创 小程序 - 上传图片到云开发后台
pages/index/index.wxml<!--index.wxml--><view>云函数调用的例子</view><button type="default" style="width: 600rpx; margin: 50rpx;" bindtap="handleOk">调用yunfoo云函数</button><button type="default" style="width: 600rpx; margin: 50rpx
2021-09-12 19:33:15
117
原创 微信小程序 - 支付功能
支付功能逻辑1. 获取用户地址,通过 uni.chooseAddress2. 获取支付需要的token 2.1 没有token的情况下,需要去到授权页面进行授权3. 创建订单,获取订单的编号4. 获取支付需要的参数5. 调用支付接口6. 查询支付状态7. 支付成功后,删除本地已支付的购物小车中商品的数据8. 跳转到订单页面准备工作:1. 检查AppID2. 检查基本路径 base_url3. 微信账号添加到 管理后台微信支付流程分析:说明小程序支付流程微信支付
2021-09-11 20:54:05
954
原创 面试分析-HTML-CSS-JS-VUE
-------------基础--------------1、H5新特性:拖拽(抓取对象以后可以拖到另一个位置)data-属性语义化标签(header、footer、nav、aside等)视频音频(video、audio)canvas本地存储(localStorage、sessionStorage)等2、C3新特性:边框圆角box-sizingrgba颜色渐变过渡动画2D转换3D转换flex布局字体图标等3、三种存储方式对比:localStorage:长期存
2021-09-11 20:36:00
330
原创 如何判断一个对象为空,一个数组为空,如何区分是数据还是字符串
判断一个对象是否为空{}1、根据 for…in 遍历对象,如果存在返回 true,否则返回 falsefor ( let i in obj) { return true;}return false2、利用JSON 自带的 JSON.stringify() 方法来判断。(大概意思就是专为字符串‘{}’,来判断)if (JSON.stringify(obj) === '{}') { return true;}return false;3、利用ES6中Object.keys(
2021-09-11 20:29:32
425
原创 小程序页面生命周期
应用级别:Page()中触发onLaunch:小程序启启动时onShow:小程序前台运行时onHide:小程序后台运行时onError:执行错误时onPageNotFount:冷启动(如扫码)打开小程序的页面不存在时页面级别:onLoad:页面加载时触发。一个页面只会调用一次,可以在onLoad的参数中获取打开当前页面路径的参数onShow:页面显示/切入前台时触发(返回、tabBar切换、前台运行)onReady:页面初次渲染完毕,相当于vue的mounted。一个页面只会调用.
2021-09-06 20:47:07
195
原创 v-slot 插槽
是预留的内容的占位符三种类型:匿名插槽:没有指定name属性,默认是default具名插槽:指定name属性,另一边使用的时候用#name值作用域插槽:用来绑定props数据定义插槽:<slot name='插槽名' :属性名(这个名称与后期获取数据时的属性名称对应)='数据'>使用插槽:<组件名> <template #插槽名='数据形参(这里是传过来的数据)'> 自定义渲染,对象可以解构 </temp..
2021-09-06 20:44:14
101
原创 Vue 后台项目 - 权限处理
现在权限相关管理系统用的框架都是element提供的vue-element-admin模板框架比较常见。权限控制常见分为三大块菜单权限控制按钮权限控制请求url权限控制权限管理在后端中主要体现在对接口访问权限的控制,在前端中主要体现在对菜单访问权限的控制。按钮权限控制比较容易,主要采取的方式是从后端返回按钮的权限标识,然后在前端进行显隐操作 v-if / disabled。url权限控制,主要是后端代码来控制,前端只需要规范好格式即可。剩下的菜单权限控制,是相对复杂
2021-09-06 19:43:34
325
原创 小程序 - 首页-回到顶部按钮
需求:实现首页回到顶部功能步骤:定义按钮,绑定点击事件,通过v-show控制按钮的显示和隐藏调用页面滚动方法:uni.pageScrollTo()控制到一定位置显示到顶部按钮获取页面滚动高度:onPageScroll()获取页面半屏高度:uni.getSystemInfoSync().windowHeight / 2如果滚动高度大于半屏高度,显示回顶按钮简单结构 <view class="yg-top" v-show="showBackToTop" @click="goTo
2021-09-05 19:02:10
383
原创 HBuilder - git 关联远程仓库
初始化本地仓库进入到项目目录中,运行git init 在根目录下面新建一个 .gitignore/.hbuilderx/unpackage/.DS_Store运行git status添加文件到暂存区添加文件到暂存区git add .提交本地的文件到仓库中git commit -m "chore:项目库初始化"提交远程仓库提交本地代码到远程仓库cd ygshopgit remote add origin https://gitee.com/thomas.
2021-09-05 15:21:52
1534
转载 判断是数组还是对象的方法
一些数组的基础知识,感觉很有意思通过typeof是无法判断是对象还是数组的第一:使用instanceof进行判断,A instanceof B即对象A是不是构造函数B构造出来的,是即返回true, 不是即返回false.第二:在typeof上进行enhancement, typeof数组和对象返回都是object, 但是数组的长度为0及0以上的整数,object的长度为undefined.方法三:利用Object.prototype.toString.call()方法将该变量转化为代表其类型的
2021-09-05 08:56:11
532
原创 vuex全局数据管理
全局状态管理库。可通过它来进行全局数据流的管理。state: 存放数据mutations: 存放操作数据的方法actions: 存放一些异步操作 (也可以进行一些同步处理) 注意: actions是不能直接修改state数据的, 需要提交mutationgetters: 存放基于state计算出来的一些值 (计算属性)modules: 分模块, 项目大了, 也推荐分模块管理 (同模块的vuex操作, 就会在一起)注意点: 分模块了, 默认muations, actions, getters 注
2021-09-05 08:39:42
166
原创 flex布局
flex-direction: 调整主轴方向row:主轴方向为水平向右column:主轴方向为竖直向下row-reverse:主轴方向为水平向左column-reverse:主轴方向是竖直向上。justify-content主要用来设置主轴方向的对齐方式flex-start: 弹性盒子元素将向起始位置对齐flex-end: 弹性盒子元素将向结束位置对齐。center: 弹性盒子元素将向行中间位置对齐space-around: 弹性盒子元素会平均地分布在行里space-between:第
2021-09-04 15:33:21
157
原创 小程序 - 使用npm
小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中,或者使用小程序支持的 npm 功能。示例:使用npm,安装一个依赖并使用# 初始化$ npm init -y# 安装 mime 模块$ npm install dayjs// 导入失败!import dayjs from 'dayjs';小程序默认不支持 npm 的模块,必须经过小程序工具构建后才可以使用,如下图所示: 这时工.
2021-09-04 14:44:02
441
原创 小程序 - 数据缓存
localStoragelocalStorage.setItem("key",JSON.stringify({test:123}))- 你如何测试localStorage的大小?https://www.cnblogs.com/djjlovedjj/p/11202195.html数据大小5M左右永久存储sessionStorage浏览器关闭的时候自动销毁cookies 1. cookies可以控制失效时间2. 会随着请求发送到后台4KB 左右wx.setStorage(Objec
2021-09-04 14:32:38
610
转载 父子组件生命周期执行顺序
我们已经非常熟悉单个的vue组件的生命周期执行顺序了,但是,如果有嵌套组件,父子组件的生命周期的执行顺序是什么?当父子组件在加载的时候,执行的先后顺序为父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted然后理解下这个顺序:1.当父组件执行完beforeMount挂载开始后,会依次执行子组件中
2021-09-04 11:47:50
5788
原创 微信小程序路由的三种方法
wx.navigateTo(Object object)保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。wx.switchTab(Object object)跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面wx.redirectTo(Object object)关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。注意⚠️:小程序中页面栈最多十层。(getCurren
2021-09-04 09:54:58
1593
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人