- 博客(88)
- 收藏
- 关注
RSS订阅转载 React.js实现原生js拖拽效果及思考
本文作者： 伯乐在线 - winty 。未经作者许可，禁止转载！欢迎加入伯乐在线 专栏作者。一、起因&思路不知不觉，已经好几天没写博客了。。。近来除了研究React，还做了公司官网。。。一直想写一个原生js拖拽效果，又加上近来学react学得比较嗨。所以就用react来实现这个拖拽效果。首先，其实拖拽效果的思路是很简单的。主要就是三个步骤：1.onmou
2016-09-28 10:50:47
986
转载 Vue 初接触实战之账单组件
Vue作为一个构建数据驱动web界面的库，是去年最火的MVVM风格库之一。Vue的用起来有Angular的影子，把很多自定义指令注入html，又吸收了React的优点和精华。比如与Vue的配套使用的Vuex就是从Redux和Flux中借鉴了不少思路。Vue从去年的下半年开始火起来，目前在Awesomes前端资源库的热度排行里面处于Top2的位置。得益于更加简洁的语法和易用性，Vue目前在社
2016-09-28 10:41:39
3258
转载 基于webpack的前端工程化开发之多页站点篇（二）
这篇，我们要解决上篇留下的两个问题：webpack如何自动发现entry文件及进行相应的模板配置如何直接处理后端模板的样式、脚本自动引入问题目录结构以express项目为例，使用express-generator构建一个初始项目，然后再添加需要的目录，最终的目录架构如下：- website - bin #ex
2016-09-28 10:37:29
1390
转载 基于webpack的前端工程化开发之多页站点篇（一）
前言碎语在最初接触webpack的较长一段时间里，我（也可能很多人）都觉得webpack是专为单页应用而量身打造的，比如webpack+react、webpack+vue等，都可以近乎完美的解决各种资源的依赖加载、打包的问题。甚至css都是打包在js里去动态添加到dom文档中去。后来想想，这么好的工具这么好的方案为什么不能用在website（普通的web站点，姑且叫做website
2016-09-28 10:36:39
6540
转载 使用 Vuex + Vue.js 构建单页应用
原文地址：https://coligo.io/learn-vuex-by-building-notes-app/前言：在最近学习 Vue.js 的时候，看到国外一篇讲述了如何使用 Vue.js 和 Vuex 来构建一个简单笔记的单页应用的文章。感觉收获挺多，自己在它的例子的基础上进行了一些优化和自定义功能，在这里和大家分享下学习心得。在这篇教程中我们将通过构建一个笔记应用来学习
2016-09-28 10:30:13
20996
1
转载 Vuejs（14）——在v-for中，利用index来对第一项添加class
（1）在v-for中，利用index来对第一项添加class[html] view plain copy a class="list-group-item" :class="{'active':!index}" v-for="(i,index) in announcement"> index来源于v-for，
2016-09-28 10:14:36
10323
转载 基于vue.js和webpack的Chat示例
todomvc看腻了，周末花时间做了一个基于Vue + Webpack构建的简单chat示例，聊天记录保存在localStorge。简单演示了Vue的component、filter、directive、computed以及组件间的事件通讯。项目地址： https://github.com/Coffcer/vue-chat
2016-09-20 10:53:30
1133
转载 css垂直水平居中的几种常用方案
绝对定位实现垂直水平居中优点：兼容性好缺点：需要知道宽高，不够灵活.element { width: 600px; height: 400px; position: absolute; left: 50%; top: 50%; margin-top: -200px; /* 高度的一半 */ margin-left: -
2016-09-20 10:04:40
506
转载 gulp & webpack整合，鱼与熊掌我都要！
为什么需要前端工程化？http://www.jianshu.com/p/9724c47b406c前端工程化的意义在于让前端这个行业由野蛮时代进化为正规军时代，近年来很多相关的工具和概念诞生。好奇心日报在进行前端工程化的过程中，主要的挑战在于解决如下问题：如何管理多个项目的前端代码？如何同步修改复用代码？如何让开发体验更爽？项目实在太多之前写过一篇博文 如何管理被多个项目引用
2016-09-20 09:57:49
2233
转载 Three.js入门——画星空（star field）
http://www.wukai.me/2015/11/15/star-field/Three.js是一个很流行的3D JavaScript库。这里有一个three.js的入门教程，在浏览器窗口中画出星空。我按照教程重新实现了一遍，这里的这篇博客把教程大致翻译了一遍。我的demo。变量定义全局变量：1234567891011
2016-09-20 09:36:08
5746
转载 用 React.js 写一个最简单的 To-do List 应用
最近在学 React.js，也写了一些练习的项目，之前参考网上的一些代码写了一个很简单的 to-do list。对于初学者来说，写个基本的 to-do list 对于理解 React 中的一些概念及语法倒是挺有帮助的。现在很多的 React 项目中已经开始使用 ES6 来写了，不过因为我在学习 React 的时候看的教程大多都是用 ES5 写的，我这里还是用的还是更熟悉的 ES5 写法，虽
2016-09-20 09:33:27
1613
转载 从头创建一个基于 React, webpack, babel 的模板项目
如果是一个刚接触 React 的新手，当学完了 React 的各种基本概念和语法之后，准备开始实际的开发工作时，他又会碰到各种新颖的名词：npm, webpack, babel, flux, es2015…… 如果以前接触过这些工具还好，否则为了建立一个简单的项目，还需要学习这一整套的流程，而在这中间又会碰上各种坑，这个过程将会非常痛苦。一个解决方案是去 GitHub 上寻找各种模板项目，用 Re
2016-09-20 09:23:19
5100
转载 jQuery判断checked的三种方法
.is(":checked") vs .prop("checked") == true 因此，特地百度了一下，结果如下： .attr(‘checked’): //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false .prop(‘checked’): //1.6+:true/false .is(‘:checked’
2016-09-19 17:33:48
912
转载 fullPage.js学习笔记
参考网址：http://www.dowebok.com/77.html 上面有详细介绍及案例展示，很不错哦，可以先去看看demo 一、简介 fullPage.js 是一个基于jQuery的插件，它能够很方便、很轻松的制作出全屏网站，主要功能有： 1.支持鼠标滚动 2.多个回调函数 3.支持手机、平板触屏事件 4.支持c
2016-09-19 17:32:06
1279
转载 Vuejs的一些总结
http://mrzhang123.github.io/2016/07/14/summarize-vue/最近一段时间忙着工作的一些事情，同时自己也在试着把项目中的一些移动端页面试着用vuejs重写，所以没时间写文章，今天终于有空可以写一下，由于页面并没有写完，所以就将自己这几天做页面的时候遇到的一些问题总结了一下。其实很多在官网都能找到，但是我们只看官网教程不去写，很难理解到底是什么
2016-09-18 15:19:53
5277
1
转载 基于Vue的简单的单页面应用
基于Vue的简单的单页面应用在对Vue和webpack有了一定了解后，我们就可以开始利用所了解的东西做一个简单的webapp了，不了解的同学可以看下我的前两篇关于vue和webpack的基本应用：webpack+vue起步利用webpack和vue实现组件化构建项目首先创建各个组件，我的目录结构如下：1234567891011121314
2016-09-18 15:04:27
7184
转载 利用webpack和vue实现组件化
在vue中实现组件化用到了vue特有的文件格式.vue，在每一个.vue文件就是一个组件，在组件中我们将html，css，js全部写入，然后在webpack中配置vue-loader就可以了。建立vue组件在src目录下建立components文件夹，并在其中建立app.vue文件，这样我们项目的目录结构如下：12345678910|--di
2016-09-18 15:03:25
1957
转载 Gulp+BroserSync实现浏览器自动刷新
在写前端代码的时候，我们为了看效果，需要一直按F5进行刷新，这样做很繁琐而且非常浪费时间，在网上搜过后发现很多关于自动刷新的办法，这里我介绍的是基于gulp和broserSync实现浏览器的自动刷新，即只要编辑器保存，浏览器就会自动刷新。 那么gulp，broserSync是什么呢？Gulp Gulp是一个前端自动化工具，基于nodejs，和grunt差不多，但是比grun
2016-09-18 14:59:50
1467
转载 webpack+vue起步
webpack与vue起步 2016-05-31 VUE VUEhttp://mrzhang123.github.io/2016/05/31/webpack-vue-2/记得第一次知道Vue.js是在勾三股四大大的微博，那时候他开始翻译vue的文档，从那时候开始到现在，看了几次vue的教程，每次都有更深的理解，因为之前并没有研究过angu
2016-09-18 14:58:37
817
转载 vue项目实践（vuex + vue-router + vue-resource）
https://segmentfault.com/a/1190000006747096?utm_source=tuicool&utm_medium=referral初次接触vue，刷完了堪称经典的vue官网文档+vue-router文档+vuex文档+vue-cli文档，然后就开始刷项目了。这篇文章总结了项目实践的一些思路。首先看下项目的总览图（mockplus制作）
2016-09-18 14:55:07
7440
转载 使用 Vue.js 制作一个简单的调查问卷平台
使用 Vue.js 制作一个简单的调查问卷平台原文 https://github.com/pramper/Demos/tree/master/Vue-Demos/Questionnaire主题 Vue.jsQuestionnaire一个用Vue.js写的微型问卷调查任务基于百度ife 任务四demo任务目的基于阶段三的各
2016-09-18 14:51:54
14055
转载 一个简单的 vue.js 实践教程
原文 https://segmentfault.com/a/1190000006776243主题 Vue.js博客地址： http://cody1991.github.io/vue/2016/08/30/a-simple-vue-guide.html公司有一个项目，其中一部分的截图如下：主要需求如下：需要拉取十个人的信息，包括封面图
2016-09-18 14:48:14
4982
转载 webpack入坑之旅
webpack入坑之旅（一）不是开始的开始最近学习框架，选择了vue，然后接触到了vue中的单文件组件，官方推荐使用 Webpack + vue-loader构建这些单文件 Vue 组件，于是就开始了webpack的入坑之旅。因为原来没有用过任何的构建工具与模块化工具，所以本系列会十分的基础。并且可能有很多不正确的地方，希望大家谅解，并指出错误帮助改进。谢谢！这
2016-09-18 14:37:05
504
转载 jQuery-easyui实现关闭全部tabs
jQuery-easyui实现关闭全部tabs有时候当我们打开很多tabs选项卡时,要关闭它只能一个一个的进行关闭,显然太麻烦,这时可以在选项卡的最右边添加一个按钮 实现关闭全部。function openTab(text, url, iconCls) { if ($("#tabs").tabs("exists", text)
2016-09-15 14:16:31
6132
1
转载 用jquery.pager.js实现分页
用jquery.pager.js实现分页1.html"/stylesheets/Pager.css" rel="stylesheet" type="text/css"/> "/javascripts/web/jquery.pager.js" type="text/javascript"> "pager">
2016-09-15 14:14:16
4340
转载 基于webpack和vue.js搭建开发环境
前言在对着产品高举中指怒发心中之愤后，真正能够解决问题的是自身上的改变，有句话说的好：你虽然改变不了全世界，但是你有机会改变你自己。秉承着“不听老人言，吃亏在眼前”的优良作风，我还是决定玩火自焚。问题所在之前的项目总结为以下内容：1、AMD模块规范开发，使用requirejs实现，使用rjs打包，最终导致的结果是，输出的项目臃肿，肿的就像一坨狗不理……不忍直视2
2016-09-15 13:14:04
1444
转载 jquery插件实现图片延迟加载
jquery插件实现图片延迟加载在页面中图片较多时，一次性加载所有图片会耗去很多时间。 我们可以选择“延迟加载”的方式来加载图片，相对这种页面的加载速度将会有个很大的提升。 图片延迟加载的原理很简单，依据用户正浏览的位置，当用户决定继续浏览文章中的其它内容时，用户会轻轻滑动滚动条， 到一个新的内容区域，图片延迟加载程序会选择在这个时候向用户展示图片。说明：1)
2016-09-15 11:22:58
606
转载 jQuery选择器大全(48个代码片段+21幅图演示)
jQuery选择器大全(48个代码片段+21幅图演示)选择器是jQuery最基础的东西，本文中列举的选择器基本上囊括了所有的jQuery选择器，也许各位通过这篇文章能够加深对jQuery选择器的理解，它们本身用法就非常简单，我更希望的是它能够提升个人编写jQuery代码的效率。本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍，也列举出了一些需要注意和区分的地方。
2016-09-15 11:21:56
599
转载 酷酷的CSS3三角形运用
酷酷的CSS3三角形运用概述在早期的前端Web设计开发年代，完成一些页面元素时，我们必须要有专业的PS美工爸爸，由PS美工爸爸来切图，做一些圆角、阴影、锯齿或者一些小图标。在CSS3出现后，借助一些具有魔力的CSS3属性，使得这些元素大多都可以由开发人员自己来完成。在开始阅读这篇文章前，我们先喊个口号：不想当艺术家的程序员不是好设计师！本文的Demo和源
2016-09-15 11:19:12
782
转载 Vue.js——vue-router 60分钟快速入门【9】
Vue.js——vue-router 60分钟快速入门概述vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，也就是组件的
2016-09-15 11:15:28
37440
2
转载 Vue.js——60分钟webpack项目模板快速入门【8】
Vue.js——60分钟webpack项目模板快速入门概述browserify是一个 CommonJS风格的模块管理和打包工具，上一篇我们简单地介绍了Vue.js官方基于browserify构筑的一套开发模板。webpack提供了和browserify类似的功能，在前端资源管理这方面，它提供了更加出色的功能。官方基于webpack提供了两种项目模板，分别是vue-w
2016-09-15 11:14:04
11567
转载 Vue.js——60分钟browserify项目模板快速入门【7】
Vue.js——60分钟browserify项目模板快速入门概述在之前的一系列vue.js文章，我们都是用传统模式引用vue.js以及其他的js文件的，这在开发时会产生一些问题。首先，这限定了我们的开发模式是基于页面的，而不是基于组件的，组件的所有代码都直接写在页面中，这对于一些复杂的页面来说，不是好事情，代码的可读性会较差，也不便于管理。其次，定义在HTML页
2016-09-15 11:12:34
1625
转载 Vue.js——使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用【6】
Vue.js——使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用概述上一篇我们介绍了如何使用vue resource处理HTTP请求，结合服务端的REST API，就能够很容易地构建一个增删查改应用。这个应用始终遗留了一个问题，Web App在访问REST API时，没有经过任何认证，这使得服务端的REST API是不安全的，只
2016-09-15 11:06:59
16140
转载 Vue.js——vue-resource全攻略【5】
Vue.js——vue-resource全攻略概述上一篇我们介绍了如何将$.ajax和Vue.js结合在一起使用，并实现了一个简单的跨域CURD示例。Vue.js是数据驱动的，这使得我们并不需要直接操作DOM，如果我们不需要使用jQuery的DOM选择器，就没有必要引入jQuery。vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest
2016-09-15 11:04:39
9218
转载 Vue.js——基于$.ajax实现数据的跨域增删查改【4】
Vue.js——基于$.ajax实现数据的跨域增删查改概述之前我们学习了Vue.js的一些基础知识，以及如何开发一个组件，然而那些示例的数据都是local的。在实际的应用中，几乎90%的数据是来源于服务端的，前端和服务端之间的数据交互一般是通过ajax请求来完成的。说起ajax请求，大家第一时间会想到jQuery。除了拥有强大的DOM处理能力，jQuery提供了
2016-09-15 11:02:08
4272
转载 Vue.js——60分钟组件快速入门（下篇） 概述【3】
概述上一篇我们重点介绍了组件的创建、注册和使用，熟练这几个步骤将有助于深入组件的开发。另外，在子组件中定义props，可以让父组件的数据传递下来，这就好比子组件告诉父组件：“嘿，老哥，我开通了一个驿站，你把东西放到驿站我就可以拿到了。”今天我们将着重介绍slot和父子组件之间的访问和通信，slot是一个非常有用的东西，它相当于一个内容插槽，它是我们重用组件的基础。Vue的事件系统独立于原生
2016-09-15 10:46:48
4682
3
转载 Vue.js——60分钟组件快速入门（上篇）【2】
组件简介组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树：金智商擎为您提供呼叫中心团队【点击进入】全方位的数据库营销与呼叫中心服务结合 让企业如虎添翼！助您走向成功！查 看
2016-09-15 10:45:16
1988
转载 Vue.js——60分钟快速入门【1】
Vue.js介绍 http://www.cnblogs.com/keepfool/p/5619070.htmlVue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。如果你之前已经习惯了用jQuery操作DOM，学习Vu
2016-09-15 10:43:09
2054
转载 Vue.js结合vue-router和webpack编写单页路由项目
一、前提1. 安装了node.js。2. 安装了npm。3. 检查是否安装成功：打开cmd，输入node，没有报“node不是内部或外部命令”表示安装成功node.js。打开cmd，输入npm，没有报“npm不是内部或外部命令”表示安装成功node.js。4. node.js下载地址：http://pan.baidu.com/s/1eRW4hiU。用
2016-09-15 10:38:10
8517
转载 vue.js视频教程，vue.js视频教程下载
最近这几年的前端圈子，由于戏台一般精彩纷呈，从 MVC 到 MVVM，你刚唱罢我登场。 backbone，angularjs 已成昨日黄花，reactjs 如日中天，同时另一更轻量的 vue 发展势头更猛，尤其是即将 release 的2.0版本，号称兼具了 angularjs 和 reactjs 的两者优点。关于vue.js我就不多废话了，大家可查阅官方文档。对于基础相对薄弱或者不想花太
2016-09-14 23:13:45
38633
5
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人