Vue-js
文章平均质量分 59
BenjaminShih
talk is cheap, show me the code
展开
-
Vue.js学习思维导图一览
Vue.js学习思维导图一览本图覆盖Vue.js学习所有基本知识点,有需要的同学可以保存到本地进行缩放,如有问题欢迎批评指正原创 2016-07-10 10:13:40 · 10397 阅读 · 0 评论 -
vue瀑布流组件滑动加载更多
建议先看上一篇再来食用本文,如果直接想看源码文末就是~上一篇讲到在项目中使用上拉加载更多组件,但是由于实际项目开发中由于需求变更或者说在webview中上拉加载有些机型在上拉时候会把webview也一起上拉导致上拉加载不灵敏等问题,我们有时候也会换成滑动到底部自动加载的功能。既然都是加载更多,很多代码思想势必相似,主要区别在于上拉和滑动到底部这个操作上,所以,我们需要注意:上拉加载是point指针原创 2017-07-18 17:56:19 · 10689 阅读 · 2 评论 -
vue 星空背景图 组件
摘下星星送给你博客的背景有点单调 不想要枯燥的白色背景 然后么自己写了个星空图 封装成vue组件 后期折腾下去换了博客的背景 可以设置星星个数(默认25)、星星颜色、线条颜色 废话不多说,直接上源码 如果问题,欢迎私信交流<template> <div class="starry-sky"> <canvas ref="canvas"></canvas> </div><原创 2017-09-15 13:06:41 · 7932 阅读 · 6 评论 -
ios 内层滚动到顶部或者底部无法滑动问题
/** * 处理一像素 */ scrollFix() { // 滚动容器dom const elem = this._container if (!elem) { return } // 兼容第一次滑动 elem.scrollTop += 1 // 绑定事件 elem.addEventListener('sc原创 2017-09-06 14:07:42 · 2747 阅读 · 0 评论 -
js 事件委托(事件代理)
事件委托,又名事件代理,就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。举例来讲,如果我们准备为一个dom绑定一个click事件,那么我们在dom上直接添加事件监听就可以了:<ul class="ul"> <li>1</li> <li>2</li></ul>window.onload = function() { var ul = document原创 2017-07-26 17:43:32 · 829 阅读 · 0 评论 -
css3 花瓣按钮
<template> <div class="pin-star"> <input type="checkbox" class="pin-leaf-checkbox"> <div class="pin-star-leaf"> </div> <div class="pin-star-leaf"> </div> <div class="pin-star-原创 2017-08-03 13:44:02 · 670 阅读 · 0 评论 -
滚动 导航栏 吸顶 固定
<template> <div> <section id="screen1" class="section1"> <p>下滑试试?</p> <nav ref="nav"> <ul> <li><a href="#">我</a></li> <li><a href="#">是</a></li> <l原创 2017-08-02 13:56:19 · 2002 阅读 · 2 评论 -
vue 页面加载进度条组件
页面加载进度条最初我是在youtube上看到的,后面几乎在各大网站上都能见到它的身影,可以让用户在加载页面的时候不会对着完全空白的页面发呆,提升用户体验但是从开发角度讲,这种进度条在真实性上确实很难把握,因为在逻辑代码加载完成之前,我们都不能统计到进度,而逻辑代码自身的进度也无法统计。另外,我们不可能监控到所有资源的加载情况。事实上,用户并不是在乎你的页面究竟加载了百分之几,而真正关心的是离加载完还原创 2017-07-25 15:24:45 · 20840 阅读 · 1 评论 -
vue 自定义指令 点击区域放大器
在vue的项目开发中一般会使用组件来进行代码复用,但是很多情况下纯粹使用组件会有一定的局限性,我们往往会追求最简洁的方式:如果只是对纯文本进行处理,无疑代码封装成filter过滤器是最好的选择–可参考《vue filter 过滤器》如果是一些全局性的简单动画提示组件或者方法(比如loading组件和axios方法),我们就可以考虑使用plugin插件为实例原型上添加方法以方便随时调用–可参考《v原创 2017-07-21 15:18:52 · 1508 阅读 · 0 评论 -
ios 调用微信JSSDK 签名失败解决方法
用SPA做微信h5,调用微信jssdk的页面,安卓微信上木有问题,ios微信报当前url未注册经过调试,是ios微信版本问题导致页面跳转url未变化,导致验签失败所以我们大致的思想就是:在ios微信环境中(判断浏览器环境请参考我的另一篇文章–js判断浏览器环境),如果跳转页面与当前页面的url不一致,那么就重载刷新整个跳转页面因为项目使用vue,所以我们使用vue-router的钩子函数before原创 2017-07-21 11:20:12 · 17109 阅读 · 13 评论 -
vue filter 过滤器
在项目开发中,我们常常需要把一些常见的文本格式化,比如说后端返回手机号需要加星号处理,或者说把一些数字加上货币单位如果说我们把这些操作在methods选项中注册为一个方法的话,虽然也是一种可行的方法,但是其缺点也很明显:methods选项常常被用来组织页面数据和交互逻辑,简单的文本处理杂糅其中语义化不明显且methods过重首先要注意几点: 1. vue1中的uppercase等vue自带过滤器原创 2017-07-17 10:12:50 · 3209 阅读 · 0 评论 -
axios拦截设置和错误处理
现在vue的官方包已经不更新vue-resource了,转而推荐axios,下面是项目实战是总结的axios插件设置:/** * @file Axios的Vue插件(添加全局请求/响应拦截器) */// https://github.com/mzabriskie/axiosimport axios from 'axios'// 拦截request,设置全局请求为ajax请求axios.int原创 2017-07-07 15:52:45 · 69780 阅读 · 5 评论 -
vue plugin 插件编写以loading为例
我们在使用vue开发的过程中,经常会遇到这两个问题:我要使用loading(加载动画) toast(浮层提示) dialog(弹框提示)之类的全局性组件,但是用全局组件注册的话非常麻烦,还要在template标签中书写组件html代码然后参数通过在data选项中注册变量来控制组件的显示/隐藏/提示语,显得异常麻烦~我要使用某些全局函数例如(axios)来进行某些操作,如果每次使用都需要impor原创 2017-07-16 17:21:50 · 12544 阅读 · 7 评论 -
简单实现Vue的observer和watcher
非庖丁瞎解牛系列~ =。= 在日常项目开发的时候,我们将js对象传给vue实例中的data选项,来作为其更新视图的基础,事实上是vue将会遍历它的属性,用Object.defineProperty 设置它们的 get/set,从而让 data 的属性能够响应数据变化: Object.defineProperty(obj, name, { // 获取值的时候先置入vm的_data属性对象中原创 2016-12-21 13:18:06 · 959 阅读 · 0 评论 -
vue-router学习思维导图
vue-router学习思维导图此图包含vue-router所有基本知识点,建立思维导图有助于记忆相关理论知识并且形成知识体系原创 2016-07-12 16:44:55 · 2995 阅读 · 1 评论 -
vue瀑布流组件上拉加载更多
最近在做移动端h5页面,所以分页什么的就不能按照传统pc端的分页器的思维去做了,这么小的屏幕去点击也不太方便一般来讲移动端都是上拉加载更多,符合正常使用习惯。首先简单写一下模板部分的html代码,,很简单清晰的逻辑:<template> <div class="loadmore"> <div class="loadmore__body"> <slot></slot>原创 2017-07-18 13:57:55 · 7679 阅读 · 2 评论