我的项目
文章平均质量分 91
初漾
编程使我快乐,越研究越嗨皮
展开
-
canvas手势解锁思路
参考:http://web.jobbole.com/90970/基本要求是这样的:将密码保存到 localStorage 里,开始的时候会从本地读取密码,如果没有就让用户设置密码,密码最少为五位数,少于五位要提示错误。需要对第一次输入的密码进行验证,两次一样才能保持,然后是验证密码,能够对用户输入的密码进行验证。具体思路如下:新建画布,指定宽度,每行排列3个圆,计算圆的半径,根原创 2017-05-12 09:52:46 · 1672 阅读 · 1 评论 -
vue.js开发外卖App项目总结(一)
1.IE8以下不支持ES5的特性,IE9+,firefoxs,chrome,safari,opera均支持ES5特性 2.MV*包括MVC、MVP、MVVM框架 应用场景:针对具有复杂交互逻辑的前端应用提供基础的架构抽象通过Ajax数据持久化,保证前端用户的体验其中vue,angular,react都是MVVM框架什么是vue.js?vue于2014年初开源,vue-route原创 2017-08-08 10:47:23 · 8202 阅读 · 0 评论 -
vue.js开发外卖App项目的内容总结(四)
需求分析1.从页面来分,分为头部和内容区。其中头部包括展示的那部分和一个浮层。内容区包括评价页,商品页和商家详情页。 2.项目所做的是SPA单页面应用,所以切换子页面时,不会去刷新整个页面。 3.对于头部,当我们点击公告和上面的数字时,需要展示黑色浮层(最后一张图片),浮层上有关闭按钮,点击按钮,浮层关闭。4.对于内容区,最复杂的是商品页,商品页拆分为左右两栏,左侧是商品的分类,右侧是商品的实际原创 2017-10-08 12:03:40 · 2753 阅读 · 0 评论 -
vue.js开发外卖App项目的组件拆分总结(五)
static目录下css中有reset.css文件,开发一个前端页面,需要将一些标签默认页面reset掉。采用的是http://cssreset.com官网提供的样式。在入口文件:index.html中引入reset.css文件,还有移动端的视口不能缩放,有个初始的宽和高设置, 可以通过配置eslintrc.js文件修改一些规则,比如:indent:0表示关于空格的规则取消。 在eslint原创 2017-10-08 20:02:44 · 2376 阅读 · 0 评论 -
vue.js开发外卖App项目的vue-resource总结(六)
在vue.js中,data属性是一个函数,因为组件可以被复用,data定义为对象时,修改某个组件,会影响另一个组件,所以data要被定义为一个函数。ES6的风格规范:data()后面需要添加空格 export default{ data() { } }vue社区有个比较火的插件:vue-resource,用来处理前后端请求数据交互的。它支持XMLHttpRequest和JSONP的原创 2017-10-09 10:42:23 · 775 阅读 · 0 评论 -
vue.js开发外卖App项目总结(二)
vue.js开发利器:vue-clivue-cli是vue.js的脚手架工具,在工程中,脚手架是帮我们编写好基础代码,所以vue-cli是帮我们写好vue.js基础代码的工具。帮我们搞定目录结构,本地调试,代码部署,热加载,单元测试等工作。 学习开源工具的方法最好是去它的github看它的readme.md vue-cli是一个node包,所以我们通过npm install -g vue-c原创 2017-10-01 17:39:51 · 2091 阅读 · 0 评论 -
vue.js开发外卖App项目总结之webpack的详细配置(三)
在运行的页面中,只有index.html和app.js,而源码没有编写app.js,index.html也没有引用任何的资源,原因是使用webpack编译。webpack的入口是package.json文件,运行npm run dev即运行node build/dev-server.js,其实是运行bulid目录下的dev-server.js文件如图为dev-server.js文件 其中一开始原创 2017-10-02 21:56:57 · 1302 阅读 · 0 评论 -
vue.js开发外卖App项目的组件传值总结(七)
弹出层透明度从0到1的过渡属性的设置(采用的是1.0的语法)指定过渡的动画层设置transition,然后再以fade的名字设置fade-transition,其中&.fade-transition指定最终的状态,<div v-show="detailShow" class="details" transition="fade"></div>css样式如下:.details posi原创 2017-10-09 15:23:57 · 628 阅读 · 0 评论