- 博客(64)
- 资源 (2)
- 收藏
- 关注
转载 Vue 分页组件 v2.0
背景之前也写过一个分页组件,非常简洁的一个分页组件。效果图: 传送门点击预览代码也很简单,看看就懂了。当页数多起来的时候,问题也就来了。这.......迫不得已,我把页码显示的去掉,就成了看着是没啥问题,可是需求方不乐意了。。。他们希望,页码多起来的时候能出现 ... 效果:Vue 分页组件 2.0"
2016-11-30 21:52:37
6331
转载 HTML5日期输入类型(date)
在很多页面和web应用中都有输入日期和时间的地方,最典型的是订飞机票,火车票,酒店,批萨等网站。在HTML5之前,对于这样的页面需求,最常见的方案是用Javascript日期选择组件。这几乎是无可争议、别无选择的做法。你可以在搜寻一下“javascript 日期选择框”,会发现有无数的可选择的JavaScript组件。大部分这些日期选择组件都提供将日期填充到指定的输入框里的功能。H
2016-11-30 21:26:21
8140
转载 webpack入门(六)——html-webpack-plugin
html-webpack-plugin该插件可以简化创建调用webpack bundles的html文件。在每次编译后,文件名会包含有hash值的bundles 特别有用。你可以让插件为您生成一个HTML文件,也可以提供您自己使用lodash模板的模板,或使用您自己的装载机。 维护者:Jan Nicklas @jantimon。安装用npm安装这个插件$ npm i
2016-11-30 20:35:58
1302
转载 webpack入门(五)——webpack 故障处理
resolveing一般问题的解决 1. –display-error-details 提供给你更多的出错信息。 2. 查问 配置文档关于 resolve 的部分。loader有它自己的 resolveing配置 resolveLoadernpm 链接的模块找不到它们的依赖。 node.js 模块的resolve步骤非常简单: 在模块的父文件夹中的node_modu
2016-11-30 20:34:17
3215
转载 webpack入门(四)——webpack loader 和plugin
什么是loaderloaders是你用在app源码上的转换元件。他们是用node.js运行的,把源文件作为参数,返回新的资源的函数。 例如,你可以用loaders告诉webpack加载 coffeeScript或者JSX。 loaders 特点: 1. 可以链式拼接。他们用在通向文件的管道,最后一个loader预期返回一个javascript,其它Loader可以返回任意格式给
2016-11-30 20:33:38
781
转载 webpack入门(三)——webpack 配置
喂一个配置对象给webpack ,它就可以干活儿了。根据你用webpack的用法,有两种途径传入这个对象:CLI( 命令行)如果你用命令行,命令行会读取一个叫webpack.config.js(或者用 –config 选项传入的一个配置文件)的文件。这个文件应该导出一个配置对象,如下:module.exports = { // configuration};123
2016-11-30 20:32:46
1766
转载 webpack入门(二)——webpack使用
安装可以用 npm 安装npm install webpack -g1注意: 这里全局安装是出于演示的目的。在真实的项目中,建议安装为你的项目依赖。开始首先,我们将只使用webpack的命令行界面学习基本webpack 。新建一个 模块化的javascript 项目cats.jsvar cats = ['dave', 'henry',
2016-11-30 20:32:02
361
转载 webpack入门(一)——webpack 介绍
转载译文:http://blog.csdn.net/keliyxyz/article/details/51571386如今的网站正在演化为web应用程序: 1. 越来越多的使用JavaScript。 2. 现代浏览器提供更广泛的接口。 3. 整页刷新的情况越来越少,甚至更多代码在同一个页面。(SPA)因此有很多代码在客户端! 一个体量庞大的代码库需要好好组织。模块系
2016-11-30 20:31:22
414
转载 入门Webpack,看这篇就够了
写在前面的话阅读本文之前,先看下面这个webpack的配置文件,如果每一项你都懂,那本文能带给你的收获也许就比较有限,你可以快速浏览或直接跳过;如果你和十天前的我一样,对很多选项存在着疑惑,那花一段时间慢慢阅读本文,你的疑惑一定一个一个都会消失;如果你以前没怎么接触过Webpack,而你又你对webpack感兴趣,那么动手跟着本文中那个贯穿始终的例子写一次,写完以后你会发现你已明明白白的走
2016-11-30 19:56:44
643
转载 Vuex 笔记
转载:http://www.cnblogs.com/wbin91/p/5958101.html一个简单的状态管理单一数据源:const sourceOfTruth = {}const vmA = new Vue({ data: sourceOfTruth})const vmB = new Vue({ data: sourceOfTruth})每当
2016-11-30 18:58:59
2078
转载 ES6新特性-------解构、参数、模块和记号(续)
六、解构 解构提供了一个方便的地从对象或数组中提取数据的方法,请看下面的例子:1234567//ES6let [x,y]=[1,2];//x=1,y=2 //ES5var arr=[1,2];var x=arr[0];var y=arr[
2016-11-30 16:49:42
1210
转载 展开运算符
展开运算符允许一个表达式在某处展开,在多个参数(用于函数调用)或者多个元素(用于数组字面量)或者多个变量(用于解构赋值)的地方就会这样。语法EDIT用于函数调用:myFunction(...iterableObj);用于数组字面量:[...iterableObj, 4, 5, 6]例子EDIT更好的 apply 方法目前为止,我们都是使用Fu
2016-11-30 15:15:14
1860
转载 Vue.js——vue-resource全攻略
概述上一篇我们介绍了如何将$.ajax和Vue.js结合在一起使用,并实现了一个简单的跨域CURD示例。Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的DOM选择器,就没有必要引入jQuery。vue-resource是Vue.js的一款插件,它可以通过XMLHttpRequest或JSONP发起请求并处理响应。也就是说,$.ajax能做的事情,
2016-11-29 16:48:51
1803
转载 如何使用Vuex+Vue.js构建单页应用
前言:在最近学习 Vue.js 的时候,看到国外一篇讲述了如何使用 Vue.js 和 Vuex 来构建一个简单笔记的单页应用的文章。感觉收获挺多,自己在它的例子的基础上进行了一些优化和自定义功能,在这里和大家分享下学习心得。在这篇教程中我们将通过构建一个笔记应用来学习如何在我们的 Vue 项目中使用 Vuex。我们将大概的过一遍什么是 Vuex.js,在项目中什么时候使用它,和如何构建我们
2016-11-29 15:55:51
2620
转载 vue2.0构建单页应用最佳实战
前言我们将会选择使用一些vue周边的库vue-cli, vue-router,vue-resource,vuex1.使用vue-cli创建项目2.使用vue-router实现单页路由3.用vuex管理我们的数据流4.使用vue-resource请求我们的node服务端5.使用.vue文件进行组件化的开发PS:本文node v6.2.2 npm v3.9.5 vu
2016-11-29 15:34:30
4864
转载 恢复 git reset -hard 的误操作
有时候使用Git工作得小心翼翼,特别是涉及到一些高级操作,例如 reset, rebase 和 merge。甚至一些很小的操作,例如删除一个分支,我都担心数据丢失。不 久之前,我在做一些大动作(rebasing)之前,我总是备份整个版本库,以防万一。直到最近我才发现git的历史记录是不可修改的,也就是说你不能更 改任何已经发生的事情。你做的任何操作都只是在原来的操作上修改。也就是说,即使你
2016-11-26 18:11:01
401
转载 理解 JavaScript 中的 Function.prototype.bind
函数绑定(Function binding)很有可能是你在开始使用JavaScript时最少关注的一点,但是当你意识到你需要一个解决方案来解决如何在另一个函数中保持this上下文的时候,你真正需要的其实就是 Function.prototype.bind(),只是你有可能仍然没有意识到这点。第一次遇到这个问题的时候,你可能倾向于将this设置到一个变量上,这样你可以在改变了上下文之后继续引
2016-11-25 18:27:40
404
转载 ajax请求插件vue-resource的学习
http://cn.vuejs.org/guide/plugins.htmlajax请求插件vue-resource的学习https://github.com/vuejs/vue-resource/blob/master/README.md1、安装npm install vue-resource112、使用import VueResource from 'v
2016-11-22 18:30:48
1626
转载 vue.js 2.0父子组件学习入门套路(推荐相关阅读)
前面已经了解过vue的组件化开发了,现在来了解一下父子组件。先来2个子组件 myname.vue 内容如下:template> div id="myname">我的名字是{{name}}div>template>script> export default{ props: ["name"] }script>12345678912345
2016-11-22 15:49:00
923
转载 Vue.js 2.0 教程精华梳理(一) 基础
Vue.js第一部分 Vue.js 介绍Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue没有完全
2016-11-22 15:28:01
8115
1
转载 vue 使用总结
1.Vuejs组件vuejs构建组件使用Vue.component('componentName',{ /*component*/ });这里注意一点,组件要先注册再使用,也就是说:Vue.component('mine',{ template:'#mineTpl', props:['name','title','city','c
2016-11-21 11:28:41
5997
转载 Webpack 入门指南 - .模块
这一次我们谈谈模块问题。通常我们希望这个项目可以分为多个独立的模块,比如,上一次提高的 hello 函数,如果我们定义为一个模块,其它模块引用之后,直接调用就好了。在前端怎么使用模块呢?这可说来话长了。如果我们把 hello 函数定义在文件 hello.js 中,内容如下:function hello(){ alert("Hello, Webpack!");}
2016-11-19 14:19:44
578
转载 webpack 插件: html-webpack-plugin
文件转载:http://www.cnblogs.com/haogj/p/5160821.html插件地址:https://www.npmjs.com/package/html-webpack-plugin这个插件用来简化创建服务于 webpack bundle 的 HTML 文件,尤其是对于在文件名中包含了 hash 值,而这个值在每次编译的时候都发生变化的情况。你既可以让这个插件
2016-11-19 11:58:19
563
转载 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-11-19 10:48:24
588
转载 详解webpack-dev-server的使用
webpack-dev-serverwebpack-dev-server是一个小型的Node.js Express服务器,它使用webpack-dev-middleware来服务于webpack的包,除此自外,它还有一个通过Sock.js来连接到服务器的微型运行时.我们来看一下下面的配置文件(webpack.config.js)var path = require("path"
2016-11-19 10:31:44
16776
转载 rem布局下使用背景图片和sprite图
现在移动端页面用rem布局已经是一大流派了,成熟的框架如淘宝的flexiable.js,以及更轻量级的hotcss。用rem作单位使得元素能够自适应后,还有一块需要关注的,那就是背景图片。本文就来聊聊这方面的东西。rem布局所谓rem布局就是指为文档的根节点元素设置一个基准字体大小,然后所有的元素尺寸都以rem为单位来写。比如将的字体设为100px,如果需要做一个100*200的元
2016-11-17 18:45:25
2165
转载 webpack配合vue.js实现完整的单页面demo
本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本。并且在项目中需要加载一些npm包,由于npm的服务器在国外,可能我们下载的过程会比较慢,所以建议用阿里的镜像cnpm安装,10分钟实时更新一次npm的镜像。具体的下载配置参考阿里的cnpm官网。本文章只是和大家探讨怎么利用webpack配合vue
2016-11-17 18:25:13
4594
转载 如何发布Node模块到NPM社区
"学骑自行车最快的方式就是先骑上去"安装node和npm安装node(注意:需要Python 2.6或2.7已经安装)$ wget http://nodejs.org/dist/v0.10.26/node-v0.10.26.tar.gz$ tar -zxvf node-v0.10.26.tar.gz$ make && make install 成功安装node之后
2016-11-17 16:26:35
444
转载 ES6 中的let、const与var的区别
首先需要明确的是let、const、var都是用来定义变量的 在ES6之前,我们一般都用var来定义变量,例如 :function test(){ var i=1; console.log(i); console.log(j); var j=2;}test();console.log(i);1234567812345678在上面的代码中,我们可
2016-11-17 14:34:03
19976
1
转载 vue-resource插件使用
本文的主要内容如下:介绍vue-resource的特点介绍vue-resource的基本使用方法基于this.$http的增删查改示例基于this.$resource的增删查改示例基于inteceptor实现请求等待时的loading画面基于inteceptor实现请求错误时的提示画面本文11个示例的源码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星
2016-11-17 11:19:39
4005
转载 Vue-cli proxyTable 解决开发环境的跨域问题
和后端联调时总是会面对恼人的跨域问题,最近基于Vue开发项目时也遇到了这个问题,两边各自想了一堆办法,查了一堆资料,加了一堆参数,最后还得我把自己的localhost映射成上线时将要使用的域名。今天翻看代码时,突然发现vue-cli的config文件里有一个参数叫proxyTable,看这个名字就感觉能解决问题,于是我就去搜了一下,果然。在vuejs-templates,也就是vue-cli的
2016-11-16 19:09:23
9020
转载 使用webpack 进行ES6开发
一些题外话使用 webpack 的初衷其实是想用 React。学习 React 的时候,始终被一个问题困扰:既然组件已经模块化了,比如一个 jsx 文件对应一个组件,这个文件里包含了这个组件的 html 和 js,但是他的样式该写在哪里呢?看的网上教程都是写在 jsx 文件里,通过变量定义,或者直接就写到全局样式里面去了。通过变量写不能定义伪元素,而且在 js 里这样写一堆样式感觉很难
2016-11-16 19:00:45
681
转载 初步探究ES6之for循环和Map,Set
现在大家先想一想,如果要你遍历一个数组的元素,你会选择如何去做呢?一般都会想起for循环:for (var index = 0; index length; index++) { console.log(myArray[index]);}123123可惜我得告诉你,这个方法是二十年的人才应该使用的方法,在ES5中已经提出了更为简便的forEach方法,代码如下:myArray
2016-11-16 18:38:03
317
转载 nodejs中exports与module.exports的区别详细介绍
你肯定非常熟悉nodejs模块中的exports对象,你可以用它创建你的模块。例如:(假设这是rocker.js文件) 复制代码代码如下:exports.name = function() { console.log('My name is Lemmy Kilmister'); }; 在另一个文件中你这样引用 复制代码代码如下:var r
2016-11-16 17:52:10
225
转载 RN----导入组件,import from 'xxxx'的用法详解
作为一个初学者,在如何导入自己写的组件时,也容易犯怵,一个简单的import问题也搞了我大半天,import的方式五花八门,细看下图吧就挑几种在RN中,特别是初学期常用的方式来说说:1.import React ,{ Component } from 'react';这是RN 0.26后导入React的方式,这意思是,导入‘react’文件里export的一
2016-11-16 16:43:37
1377
转载 Node.js的Path对象
NodeJS中的Path对象,用于处理目录的对象,提高开发效率。用NodeJS的Path命令,与使用Linux下的shell脚本命令相似。引入path对象:var path = require('path');比较实用的方法:格式化路径 path.normalize(p)特点:将不符合规范的路径格式化,简化开发人员中处理各种复杂的路径判断示例:p
2016-11-16 16:04:08
589
转载 Vue.js学习 Item5 -- 计算属性computed与$watch
在模板中绑定表达式是非常便利的,但是它们实际上只用于简单的操作。模板是为了描述视图的结构。在模板中放入太多的逻辑会让模板过重且难以维护。这就是为什么 Vue.js 将绑定表达式限制为一个表达式。如果需要多于一个表达式的逻辑,应当使用**计算属性**。基础例子div id="example"> a={{ a }}, b={{ b }}div>123123var vm = new Vue
2016-11-16 14:29:51
931
转载 ECMAScript5和ECMAScript6的新特性及浏览器支持情况
ECMAScript第六版已经于2015年发布,某些浏览器已经开始支持ES6了,这篇文章整理一下ES5以及ES6的新特性。ECMAScript简介它是一种由Ecma国际(前身为欧洲计算机制造商协会)制定和发布的脚本语言规范,JavaScript在它的基础上进行了自己的封装。但其实通常来说,术语ECMAScript和JavaScript指的是同一个东西。JS包含三个部分:ECMAScri
2016-11-16 14:14:21
5622
1
转载 基于ES6,使用React、Webpack、Babel构建模块化JavaScript应用
如果你想用React构建一个新的JavaScript应用,而且你还想实践ES6语法中的新特性,此外,你甚至想创建一些可重用组件并发布到NPM上,那么你究竟应该怎样实现这些需求?你如何将ES6代码发布到NPM,又如何在后续的项目中使用这些代码?我花了一些时间解决上面这些问题,现在我愿意与你们分享我习得的新知识。如果你真的不希望阅读所有的细节,只想看看代码最终的效果——可以直接阅读最后一部分。
2016-11-16 11:48:46
628
转载 NodeJS中 package.json 解析
package.json 中包含各种所需模块以及项目的配置信息(名称、版本、许可证等)meta 信息。包含可配置项name 名称应用描述 description版本号 version应用的配置项 config作者 author资源仓库地址 respository授权方式 licenses目录 directories应用入口文件 main命令行文件 bin项目应用运行依赖模块 dep
2016-11-16 11:41:59
374
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人