自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 收藏
  • 关注

原创 pc端滑动加载更多 vue组件vue-data-loading

1.需求:在PC端实现数据滚动加载效果 筛选vue中的组件再三 决定使用vue-data-loading 效果还是蛮赞的 官网地址:https://github.com/bedlate/vue-data-loading/blob/master/README_CN.md2.简单的事例 官网中已有源码 需要的小伙伴 可以直接查看官网 在这里我主要说下我遇到的坑 我的列表页面如图所示...

2019-05-14 17:08:00 4757

原创 nginx+vue+webpack配置二级域名

⚠️:文中的demourl指的是二级文件的名称1.修改生成文件中的路径 config/index.js文件2.修改路由文件中的base 配置3.修改nginx中的配置4.在地址栏中输入地址即可 大功告成 配置完成后千万记得重启哦...

2019-03-16 17:28:24 1808

翻译 svg-icon的使用

1.webpack.base.conf中配置svg的依赖和loader { test: /\.svg$/, loader: 'svg-sprite-loader', include: [resolve('src/icon')], options: { symb...

2019-03-16 10:50:18 10828

原创 vuedraggable插件使用---小心得(欢迎广大网友补充)

1.最近有个需求是 a)左边菜单栏的菜单项拖动到右边的容器中; b)左边的菜单栏的内容不变 c)拖动的过程中默认的影子单元来模拟被拖动单元换成固定的图片综上,上网找了很多有关的vue拖拽组件,其中发现vuedraggable组件比较符合需求。2.官网地址:https://www.npmjs.com/package/vuedraggable发现功能确实强大,然后就着...

2018-12-08 16:31:54 19588 47

原创 vuejs实现倒计时

1.短信60s倒计时代码实现 : a)html结构<template> <div class="buttonItem"> <input v-model="vercode" type="text" placeholder="输入验证码"> <div class="re

2018-10-18 11:19:03 16587 2

原创 element-ui 小技巧

需求:使用el-cascader动态逐层次加载省市区数据,编辑数据时默认显示对应的区域数据效果如图所示:代码如下:a)逐层次加载省市区数据 demo.vue 代码如下所示: <el-cascader :props="props" v-model="areaArr"> </el-casca...

2020-02-09 19:13:24 433

原创 前端使用goeasy

项目需求:手机端扫PC端二维码 上传本地图片 上传成功后PC端根据上传的图片进行以图搜图操作通过技术选型 感觉go-easy既方便使用又能符合需求1.首先在go-easy官网(http://www.goeasy.io/)注册一个账号2. 拿到appkey 进入官方开发文档 (http://www.goeasy.io/cn/started) 如果项目是不包含webpack 则...

2019-07-31 12:19:00 3006

原创 element-ui+vue部分小技能

[email protected] 移动端弹出框禁止底部滑动 (vuejs方法)eg:2.el-table 行列合并table:span-method="objectSpanMethod"实现效果如图所示3.el-table 多选 默认选中this.$refs.multipleTable.toggleRowSelection(row,t...

2019-06-05 18:21:36 261

原创 简易版的商品sku

实现效果如下需求解析1)转换接口返回的sku数据 初始化一部分必要的变量数据labels(当前规格的所有规格名称 如途中的 颜色和尺寸)curProps (items===>所有规格条,result====>所有规格和对应的规格值)disabledSelected (不能进行点击的规格)curSelected (当前已经选择的规格)split...

2019-05-30 22:49:23 465

原创 轮播图组件 之 vue组件vue-data-loading

前提:虽然 swiper样式效果相当的全面 但是太重是我不想要的 所以才找了下面的组件进行使用 如果小伙伴们有更好用的组件 希望能不吝分享。宗旨是 学海无涯 相互分享 共同进步1.vue-agile 官网地址https://github.com/lukaszflorczak/vue-agile demo源码编辑地址https://codepen.io/collection/AdRz...

2019-05-14 17:42:10 901

翻译 AES加解密js文件

1.引入 npm install crypto-js --saveconst CryptoJS = require('crypto-js');2.方法A)加密export function encrypt(word){ //加密 var key = CryptoJS.enc.Utf8.parse("yourkey"); var srcs ...

2019-04-24 11:40:00 2746

原创 开发工具之VSCode

step one:下载 url:https://visualstudio.microsoft.com/zh-hans/step two:下载中文包插件mac : command+shift+pA)B)C)重启后完成 如图所示step three:配置语法检查和es6语法插件https://blog.csdn.net/zhengy...

2019-04-19 15:53:39 158

翻译 小笔记

1.vuejs不能监测到给数组赋值 因为javascript的限制解决办法:this.curarrlist.splice(index,1,curindexval)2.数组有关的操作(去重) 常规:let arr = [11, 23, 26, 23, 11, 9] const deduplication = arr => [...new Set(arr)] ...

2019-01-17 11:20:27 164

原创 判断浏览器是否支持webp格式的图片

function check_support_webp() { let isSupportWebp = document.createElement('canvas').toDataURL('image/webp').indexOf('data:image/webp') == 0; return isSupportWebp}let isSupportWebp = check...

2018-12-13 10:05:26 984 1

原创 vue自定义全局组件

1.创建一个组件文件夹内新建一个.vue和.js文件2..vue组件中就是组件的内容,.js文件中使用install方法将组件注册为全局eg:下图import scrollDiv from './scrollDiv'const defaultComponentName = 'scrollDiv'const scrollDivBox = { install(Vue, opti...

2018-11-28 18:28:21 374

原创 vue实现全选 单选功能

实现效果 待选 全选 单选 多选代码1.页面结构2.逻辑代码3.binggo 就这么愉快的完成了

2018-11-17 15:42:44 3415 3

原创 使用阿里云网关api进行数据的请求

1.在node项目中 install 需要的包npm install aliyun-api-gateway -S2.添加完成后根据官方文档进行编辑client端上代码(前提是在阿里云网关部分已经设置好了相关的网管api内容,这边只讲述前端进行调用的部分)export async function post(url,data,callBack) { var result...

2018-06-23 16:58:49 3394 7

原创 mac 版本使用ngrok,方便联调,本地内网映射为外网

下载ngrok的压缩包到本地 。官网地址:https://ngrok.com/    用户登陆/注册,成功后出现如下图,按照步骤指导进行操作即可。A) 第一步下载压缩文件;B) 第二步解压,unzip ngrok.zip的路径地址(路径根据实际情况填写)C) 第三部authtoken后面的就是你账号自动生成的tokenD) 第四部help 验证是否配置成功E) 第五部直接放入你要映射的本地的地址 ...

2018-05-25 10:19:55 3224

原创 vue webpack 构建项目 git 代码管理

1.全局安装 vue-clinpm install --global vue-cli(如果之前已经全局安装过了 跳过该操作 直接进行2)2.打开项目,初始化为webpack模版的项目vue init webpack3.安装依赖 根据提示进行操作4.初始化成功,直接运行 npm run dev5.成功运行 直接打开 红线链接6.出现下面内容表示项目创建成功...

2018-04-17 16:36:15 1724

翻译 解析json

1.解析json eg:var jsondata=’{“staff”:[{“name”:”zhang”,”age”:11,”sex”:”男”}]}’;a)eval(‘(‘+jsondata+’)’); b)JSON.parse(jsondata);return { “staff”:[ {

2017-07-03 16:55:39 187

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除