2017年7月3日
vuex实践之路——笔记本应用（三）
摘要： Actions Action 类似于 mutation，不同在于： Action 提交的是 mutation，而不是直接变更状态。 Action 可以包含任意异步操作。 让我们来注册一个简单的 action,实践中，我们会经常会用到 ES2015 的 参数解构 来简化代码（特别是我们需要调用 com 阅读全文
posted @ 2017-07-03 16:51 herozhou工巧 阅读(652) 评论(0) 推荐(1) 编辑
vuex实践之路——笔记本应用（二）
摘要： 上一篇我们简单介绍了vuex在此项目中的作用。 这次来理一下项目的整体思路。 main.js上次看过了，首先看App.vue文件 我们引入了Toolbar.vue,NodeList.vue,Editor.vue并渲染到页面中。 Toolbar.vue的代码在上篇文章中也存在，来看下NodeList. 阅读全文
posted @ 2017-07-03 16:50 herozhou工巧 阅读(664) 评论(0) 推荐(0) 编辑
2017年7月2日
vuex实践之路——笔记本应用（一）
摘要： 首先使用vue-cli把环境搭建好。 介绍一下应用的界面。 App.vue根组件，就是整个应用的最外层 Toolbar.vue：最左边红色的区域，包括三个按钮，添加、收藏、删除。 NoteList.vue：中间蓝色区域，笔记列表。 Editor.vue：最右边紫色区域，编辑区域。 第一步 安装vue 阅读全文
posted @ 2017-07-02 14:24 herozhou工巧 阅读(1194) 评论(0) 推荐(0) 编辑
2017年6月18日
vue-router单页应用简单示例（二）
摘要： 我们先来理一下思路。 图1:main.js 引入vue,App.vue,router/index.js文件 声明要渲染的Id为app，将App.vue中的模版渲染到入口界面（就是打开localhost:8080会看到的那个页面）。 图2:App.vue router-view是显示路由内容的地方，比 阅读全文
posted @ 2017-06-18 19:08 herozhou工巧 阅读(2806) 评论(1) 推荐(0) 编辑
2017年6月16日
vue-router单页应用简单示例（一）
摘要： 请先完成了项目初始化，具体请看我另一篇博文。vue项目初始化 看一下完成的效果图，很典型的单页应用。 .vue后缀名的单文件组件 这里先说一下我对组件的理解。组件，顾名思义就是一组元素组成的一个原件（理解的比较浅显、直白），在Vue.js中，表现为一个自定义元素。开篇展示的图中，首页的的列表中的每一 阅读全文
posted @ 2017-06-16 22:00 herozhou工巧 阅读(5446) 评论(0) 推荐(1) 编辑
vue-router单页应用简单示例（三）
摘要： 用vue-resource向服务器请求数据 我们主要来了解一下以下内容： 模拟服务端返回数据 用vue-resource向服务器请求数据 模拟服务器返回数据 我们用vue-cli创建的项目中，已经给我们提供了模拟服务器端返回数据的地方和接口。如下图所示，在项目目录的build目录下，有一个dev-s 阅读全文
posted @ 2017-06-16 10:47 herozhou工巧 阅读(1739) 评论(0) 推荐(0) 编辑
2017年6月15日
vue基础项目安装教程
摘要： 安装node.js 从node.js官网下载并安装node，安装过程很简单，一路“下一步”就可以了。 安装完成之后，打开命令行工具，输入 node -v，如下图，如果出现相应的版本号，则说明安装成功。 安装cnpm 在命令行中输入 npm install -g cnpm --registry=htt 阅读全文
posted @ 2017-06-15 21:05 herozhou工巧 阅读(1879) 评论(0) 推荐(0) 编辑
vue初学实践之路——vue简单日历组件(3)
摘要： 这一篇我们来实现管理员修改每一天剩余数量的功能。 我们在data中加入了checkedDays数组，用来存放我们所选定的日期，因为我们不需要修改checkDays数组中的值，所以不使用对象数组的方式。 checkedCount为默认修改20天的剩余数量。 页面效果为： 这样我们就实现了管理员修改日期 阅读全文
posted @ 2017-06-15 17:24 herozhou工巧 阅读(1364) 评论(0) 推荐(0) 编辑
vue初学实践之路——vue简单日历组件(2)
摘要： 上一篇我们已经实现了基本的日历显示功能，这一次我们要加上预定的功能 废话不多说，上代码 js代码 原理就是使用v-if判断当前日期是否具有index属性，如果有，就说明当前天是可供预定的。 在vue data中加入leftobj对象数组，存放每一天剩余数量count的值。 这里有个问题，为什么不直接 阅读全文
posted @ 2017-06-15 17:13 herozhou工巧 阅读(1777) 评论(0) 推荐(0) 编辑
vue初学实践之路——vue简单日历组件(1)
摘要： 最近做的项目有一个需求，需要有一个日历组件供预定功能使用，之前的代码过于繁琐复杂，所以我采用vue重写了这个组件。 效果图。 只是一个简单的日历组件，所以并不需要用到node服务器，只需要一个Html文件即可。 项目基本目录 首先在引入 vue.js 贴上最主要的html和js代码 核心是使用vue 阅读全文
posted @ 2017-06-15 16:53 herozhou工巧 阅读(42898) 评论(1) 推荐(0) 编辑