- 博客(86)
- 资源 (5)
- 收藏
- 关注
原创 解决vue中字符串不换行问题
1、废话少说,直接贴代码 // 1、待处理字符串let str = "【保险公司】↵本产品由复星联合健康保险股份有限公司承保。↵复星联合健康保险股份有限公司是保监会批准设立的专业健康保险公司"// 2、处理方法str = str.split(/\n|\r\n/g,)// 3、处理后的数据变成和索引数组[ '【保险公司】', '本产品由复星联合健康保险股份有限公司承保...
2019-07-15 12:02:28 4300
原创 解决nuxt官方脚手架的一些坑:1、支持es6+语法 2、样式支持sass
1、支持ES6+语法,以server/index.js为例,将require修改为ES6的import模式: 初始化: 解决方法: (1)修改package.json文件,在“dev”和“start”命令后面新增:--exec babel-node (2)项目根目录下新增babel配置文件“.babelrc”文件,写入以下配置...
2019-02-27 09:52:01 2283
原创 回归css之-less实现左侧导航高度至少100%,右侧高度随内容自适应
1、如图,通用CMS布局,左侧导航,右侧有容,flex布局,嵌套在外层盒子中 解决主要问题:当右侧高度高于一屏高度时,左侧导航也能自适应 2、HTML代码<!-- 在外层盒子 --><div class="app-wrap"> <!-- 左侧导航 --> <div class="left-nav-wrap">...
2018-12-18 15:20:33 1965
原创 zTree移除节点的class: 。/* 自定义:覆盖选中的背景色 */ .no-curSelectedNode{ curSelectedNode, 可toggle切换
1、自定义class: no-curSelectedNode /* 自定义:覆盖选中的背景色 */ .no-curSelectedNode{ background-color: #fff !important; border: 1px #fff solid !important; ...
2018-09-29 11:53:35 1479
原创 jquery监听ctrl + c 和 鼠标右键“复制”事件
这里是测试复制粘贴 别说公开发言,朋友间过于慎言,迹近官腔的交谈,即由虚伪主导,语言无味之余并不能达到有效率的交流。所以,退一万步想,有时宁愿多些听到老友的失言(或往往是真言)。我永世不能忘记的是我一生的知己在酒醉后把我大骂一场,激动处更用球鞋掷过来。礼貌上他是失礼,但我当场哭将起来,知道他对我的关心与痛心肉紧若此,胜过平常饭局上评谈时事娱圈是非之交友正确。从此我每吃一颗安眠药
2018-04-16 10:56:23 6346
原创 一个前端攻城狮的全栈之路第七弹:python打印一个简单的阶梯数字
1、先看效果:(1) 如果用户输入5,则打印:(2) 如果用户输入6,则打印:2、python的实现代码# 定义一个方法,接收用户输入的数字,输入几,则打印几行阶梯数字# global startRow 函数内部调用函数外部的方法startRow = 0def digitalTower(row): global startRow row = int(r
2018-04-03 17:50:08 1639
原创 解决iview 中i-table的render方法this指向window(requirejs模式下)
1、i-table通过render方法渲染的的删除按钮,调用时this指向变成window2、解决方法,用一个变量接收new Vue()的对象即可
2018-02-06 17:59:35 2663
原创 Angular5初探之--构建一个简单的单页应用,包含登录(login)和几个一级菜单
1、项目目录结构为:@angular/cli标准目录结构,截图如下:2、src开发文件夹已经上传至github,需要的朋友可以参考 : https://github.com/chuanzaizai/Angular5_demo3、使用@angular/cli快速构建项目,可参考官方文档:https://cli.angular.io/4、使用@angular
2017-12-26 15:47:58 4328
原创 vue2+iview+require实现AMD模式下的组件化开发、按需加载
1、最近项目遇到的需求:不使用webpack, 采用老设计模式AMD,实现按需加载,组件化开发2、主要技术栈: vue (https://cn.vuejs.org/v2/guide/) iview (http://v1.iviewui.com/) requirejs (http://requirejs.org/) css样式采用l
2017-12-21 20:21:58 4493
原创 解决iview在requirejs模式下使用报错:组件未注册
1、iview在require(AMD)模式下的使用,如下文,已经配置好main.jsrequirejs.config({ // baseUrl:'./', paths:{ jquery:'jquery.min', less:'less-1.6.3.min', vue:'vue', iview:'iview.min
2017-12-21 14:03:52 2528
原创 表现与数据分离第一篇:mvc设计模式实现pdf数据流弹窗预览
吼吼吼: 喊出程序员的心声,远离jsp,前后端分离!!!!!!1、常用的js开发模式,尤其是jquery开发模式,一般都是重复累赘的书写,毫无维护性和可读性而言,例如要是有一天id变了,需求变了,就jj了2、所以,设计模式是多么多么的重要,本文只阐述简单的mvc设计模式,淌水不深,有什么问题还望各位大神多多指点!3、例如,现在需求来了
2017-12-06 14:04:13 788 1
原创 webpack开发vue2项目中的一些坑(1、跨域 2、打包后后端访问一片空白3、加载第三方库的字体文件出错4、加载背景图出错)
1、在开发调试过程中,解决跨域的问题例:本地服务器:localhost:3030 服务器地址:192.111.1.1:4000(虚构)webpack配置:devServer: { contentBase: "./static/", host: 'localhost', port: 3030, inline: true
2017-09-19 17:14:52 4396
原创 javascript处理json/base64等数据并且下载成本地json/image文件(angular环境、execCommand)
github地址:https://github.com/chuanzaizai/execCommand_downlaod1、最近项目有这样一个需求:后端返回json字符串、base64数据,前端处理并且下载成本地文件2、技术栈: angular、window.navigator.userAgent、document.execCommand(IE浏览器)、a标签的download属性3、
2017-09-05 18:37:41 1446
原创 angular中ng-mouseenter、ng-mouseleave的时间差导致dom闪屏问题(timeout可缓解)
1、现在比如有两个独立的平级模块,要实现鼠标移入nav-wrapper、list-wrapper显示list-wrapper,移出则隐藏(1)显示所有导航(2)导航列表2、js代码// 初始化为false$scope.showList = false;// 鼠标移入$timeout(functon(){ $scope.showList = true;},
2017-09-04 09:20:43 1864
原创 一个前端攻城狮的全栈之路第六弹:nodejs、jade、mongodb、mongoose、七牛云实现列表的增、删、改
源码地址,欢迎star和follow: https://github.com/chuanzaizai/node_todoLIst1、本文后期在讲述实现思路,先看看前端的实现效果2、列表页:3、详情页:4、修改页:(ps: 修改页这里已经做了判断,如果用户未重新上传图片,则展示原图片)5、新增页:
2017-07-15 17:41:18 1047
原创 一个前端攻城狮的全栈之路第五弹:mongoose简单使用(实现对mongodb的增、删、改、查)
*****序:1、既然要向全栈靠拢,操作数据库就是必修课,mongodb的介于关系数据库和非关系数据库之间的产品,它存储的格式区别于传统MySQL的字段类型,而是类似于json,这对于前端的小伙伴来说又是一大福利,json每天都存在前端的http请求中2、mongoose又是操作mongodb的一大福利,我们不用在控制台去写繁琐累赘的insert/update/remove语句,mongo
2017-07-15 15:37:03 720
原创 一个前端攻城狮的全栈之路第四弹:jade模板引擎的简单介绍和使用
1、类似于java的jsp模板引擎一样,nodejs的模板引擎jade也是爽歪歪,下面就简单说明一下本文大致介绍的jade内容(1)拆分可复用的模块,以及怎么在其余模块里引入复用对的模块,这里的模板又分为两类: a. head中的link和script标签 b. htmld的头部声明,就是doctype html定义的部分(2)定义块级元素:“block content"(3)
2017-07-15 12:31:21 1405
原创 一个前端攻城狮的全栈之路第三弹:七牛云存储空间的申请
1、访问七牛云地址,申请个人 账户:https://portal.qiniu.com/signup/choice2、接着按照老3步,即可完成注册3、注册完成后,进入“个人中心-->密钥管理”查看ACCESS_KEY和SECRET_KEY,七牛云会生成两组ACCESS_KEY和SECRET_KEY,默认使用第一组即可*注 :ACCESS_KEY和SECRET_
2017-07-15 11:40:33 802
原创 一个前端攻城狮的全栈之路第二弹:mongodb的本地安装
1、首先进入官网,选择操作系统和版本,下载安装包:https://www.mongodb.com/download-center 2、安装的时候可按默认配置,路径可安装到D盘下,安装完成后,完成以下2步操作即可 (1) 在D:\MongoDB\下新建data文件夹 (2) 在D:\MongoDB\data下新建db文件夹
2017-07-15 10:22:24 599
原创 vue2开发之实现可复用的轮播图carousel组件
1、千年老规矩,上效果图,说明功能:(1) 实现定时器,鼠标未移上图片时,自动轮播切换(2) 有左右切换按钮,可切换至上一张、下一张(3)有底部小图标,可自由切换至任意一张github参考地址:https://github.com/chuanzaizai/vue_carousel2、组件设计思路:(1)由于是可复用的子组件,图片的宽高、定时器间隔时间、轮播图list应由
2017-07-11 09:17:14 7436
原创 来来来,用高德地图实现ofo小黄车地图定位
1、直接上图,看看效果,拖动定位可重新加载附近小车位置 2、所用技术:高德地图API,es6的class、promise等3、时间有限,下次再讲述思路和 实现过程 demo已经上传到github,感兴趣的小伙伴可以先去看看:https://github.com/chuanzaizai/ofo-map
2017-05-19 18:19:49 7534
原创 前端常见的一些正则表达式(一定范围内数字、小数位数、手机号、中英文名字包含少数名族)
1、输入一定范围的数字(例:[0,200]) var reg = /^(\d{1,2}|1\d{2}|200)$/; \d{1,2} : 0-99 1\d{2} : 100-199 200 : 200 扩展一下:如果现在需求变了,要求限制输入(0,200) var reg = /^([1-9]|[1-9]\d|1\d{2})$/; [1-9] : 1-9 [1-9]\d : 10-...
2017-05-09 14:37:56 3024
原创 一步一步来实现webpack+vue的多页面应用
1、现如今的前端,一提到vue、react、angular,大家第一印象就是单页应用。但是连尤雨溪都说过,他从来没说过vue仅适用于单页应用,下面我们就一步一步来实现多页应用2、全局环境配置和主要使用到的主要开发工具:node、npm、webpack、sass、vueps:这里多说一句,sass的安装依赖淘宝镜像会比较容易:(1) 首先全局环境下配置淘宝镜像(注意:是全局环境,也就是c
2017-05-04 11:37:10 2893
原创 better-scroll实现下拉刷新、上拉加载更多(巨简单...)
1、废话少说,先看看移动端的列表页面(1)正常浏览(2)下拉刷新中(3)下拉刷新结束(4) 上拉加载(5)上拉 加载中2、上述基本上就是一整套移动端列表的刷新过程,采用better-scroll实现,其github地址可参考 https://github.com/ustbhuangyi/better-scroll3、网上也有一些基本使用教程,这里就不
2017-04-29 16:27:44 50443 5
原创 vue2中子组件修改父组件传入的prop,并向父组件$emit一个广播事件
1、在vue中: prop 是单向绑定的:当父组件的属性变化时,将传导给子组件,但是不会反过来。这是为了防止子组件无意修改了父组件的状态——这会让应用的数据流难以理解。 另外,每次父组件更新时,子组件的所有 prop 都会更新为最新值。这意味着你不应该在子组件内部改变 prop 。如果你这么做了,Vue 会在控制台给出警告。 更多可参考:https://cn.
2017-04-26 10:51:52 8272
原创 抛开table布局,我们也能实现单线边框
1、前端项目中,“单线边框”列表已是屡见不鲜:采用table布局,实现起来难度不大,如果抛开table布局呢?下面我们就来尝试一下2、先上图,看最终效果:3、html代码: 1 2 3 4 5 6 7 8 9 10 4、css代码,margin-right的妙用*{ margin: 0;
2017-04-18 10:11:36 635
原创 js实现图片转base64(兼容IE8+)
最近做电商项目,遇到如下一个需求:商品评价页面:用户上传图片,点击“”确定“”前,图片由前端实现base64转码(ps:由于商品评价页面可能存在多个产品,每个产品评价又可上传多张图片,所有前端img 转码可以有效的优化http请求,减小服务器的压力)下面我们一步一步来看看demo代码:(1)定义一个隐藏的input[type = 'file'],通过按钮触发其change事件
2017-04-13 09:25:02 16473 7
原创 vue2实现简单的商品加入购物车和结算功能(前端数据保存方向)
1、最近做电商项目,遇到类似的商品“加入购物车”和“结算功能”,页面大致如下(:下面是demo版):主要功能如下:(1)、用户可以任意修改购买的商品数量,点击“加入购物车”后前端保存 (2)点击“结算”时向后台发送用户已经“”加入购物车“”的商品2、下面我们来看看具体实现步骤:(1)首先,我们需要商品goods,ps:在此项目中,默认的商品数量和加入购物车的数量由后台传入,为1
2017-04-10 09:53:36 25642
原创 new date()标准时间转yyyy-mm-dd hh:mm 24小时制
知识点:es6的Object方法、正则表达式、循环对象等直接贴代码: new date()标准时间转yyyy-mm-dd hh:mm 24小时制 // 扩充js的内置对象Date方法 Object.assign(Date.prototype, { switch(time) { let date = { "yy":
2017-03-24 20:42:24 10638 1
原创 vue、vue-router切割js,实现按需加载
前言:随着前端技术的发展,富页面越来越多,如果将所有模块打包为一个js,必然会影响性能,所以按需加载是大势所趋********** 只需两步,就能实现第一步:定义router.js第二步:添加webpack配置信息 更多详细信息,可访问github地址:https://github.com/chuanzaizai/vue-load-on-demand
2017-03-22 18:13:47 6409 1
原创 申请github账户,托管代码到github全套教程来了(依据github2017最新版界面)
第一步:申请github账号1.进入github官网 网址:https://github.com/,点击右上角“Sign up”按钮2、依次输入用户名、邮箱、密码,完成后点击“create an account”按钮3、下一步,选择是否免费建库4、完善邮箱 ok,按照以上操作,小伙伴们就拥有github账号了,接着就可以上传代码了
2017-03-22 17:37:38 2335
原创 icon图标在线生成教程(svg转icon)
1、准备好项目的Svg文件2、访问在线生成工具,网址:https://icomoon.io3、其余操作步骤按照如下截图(1)点击右上角“icoMoon App”按钮 (2)点击按钮导入svg文件(3)查看使用方法 (4)定义下载文件名称和相关配置
2017-03-02 14:28:32 12362 1
原创 百度地图实现多点定位(包含两种点:当前自己所在的位置和周围需要查找的点 )
首先,要感谢下清山博客的博文 ,,, 链接地址:http://blog.csdn.net/a497785609/article/details/240090311、直接上图,看看效果(本例中的坐标数据为前端假数据)解释一下大概实现的功能:(1)用户访问网页时,定位到用户当前的位置(图中小熊头像),坐标可由前端获取或者后台http传入(2)再搜索到用户周围的物流网点,物流网点坐标数组
2017-02-28 15:42:14 8702
原创 canvas实现折点图,并有鼠标hover样式
1、直接上图,看最终样式2、html代码 您的浏览器暂不支持canvas 3、js代码$(function(){ var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d"); /*开始绘制外边框*/ cxt.beginPath(); cxt.strokeStyle
2017-02-05 16:17:28 6211
原创 U盘中毒后,怎么恢复被隐藏的文件
1、新建一个文本文档,输入以下内容for /f "delims=?" %%a in ('dir /a /b') do attrib -a -s -h -r "%%a"¡¡¡¡@echo off¡¡¡¡pause>nul¡¡¡¡exit2、将文本文档的后缀名改为‘xx.cmd’(名称可自定义)将XX.cmd拷贝至U盘根目录下,双击即可恢复
2017-02-04 10:30:43 4615
原创 gulp环境下安装sass
1、首先全局环境下配置淘宝镜像(**注意:这里是全局环境,不是项目根目录)执行语句:npm install -g cnpm --registry=https://registry.npm.taobao.org2、进入项目根目录,安装执行语句:cnpm install --save-dev node-sass3、仍然是项目根目录,安装 执行语句: npm i
2017-01-18 09:53:44 5599
原创 Angular、React、Vue在线学习文档
1、Angular学习文档http://www.jb51.net/article/60757.htm =>($routeProvider相关教程)2、React学习文档https://segmentfault.com/a/1190000007141049 => (react-router按需加载)https://yq.aliyun.com/articles/2628 = >
2017-01-10 17:42:26 563
原创 利用gulp-connect和browserSync创建本地服务器,实时刷新页面
1、gulp-connect的方法(直接上代码)**创建完成后,直接访问localhost:8080即可//定义依赖和插件var gulp = require('gulp'), uglify = require('gulp-uglify'), concat = require('gulp-concat'), rename = require('gulp-rename'), conne
2017-01-10 16:42:20 2867
原创 为echarts的叠加柱状图设置颜色
1、废话少说,直接上代码(前提先引入echarts先关文件) var myChart = echarts.init(document.getElementById('chartOne')); // 指定图表的配置项和数据 var option = { title: { text: '近'+days+'天各类型通知发布数量', t
2016-12-29 15:28:55 22091 1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人