# todo-vue

**Repository Path**: artman/todo-vue

## Basic Information

- **Project Name**: todo-vue
- **Description**: No description available
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2018-06-28
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# todo-vue

> A Todo list app in vue.js

## Build Setup

``` bash
# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report
```

For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).


用 Vue 框架开发 “待办事宜” 单页应用程序

功能：
一、增加待办事项
 1、在输入框中输入，回车保存，ESC 键取消；
 2、如果没有输入，回车不保存；
 3、如果输入的是空格，回车不保存，将输入清空。

 二、删除事项
 1、点击 X 号，弹出对话框，“确定”后删除，“取消”后不删除；
 2、在有“已完成”事项的情况下，点击“清除所有已完成”，弹出对话框，“确定”后删除，“取消”后不删除。

 三、改变事项
 1、改变状态
  1）点击事项前的勾选框，勾选代表“已完成”，否则代表未完成；
  2）点击“全部标记完成”，所有事项都标记为已完成或取消已完成；
  3）已完成事项用特别的样式表示（如：删除线、灰色等）。
 2、修改事项说明
  1）双击未完成的事项说明，进行编辑，回车 - 保存，ESC - 取消，失去焦点 - 取消；
  2）保存时，若发现说明为空串，恢复原有说明内容。

 四、查询过滤
 1、状态过滤
 点击“全部”、“未完成”、“已完成”分别显示不同状态的事项。
 2、事项说明过滤
 在过滤输入框中输入关键字，自动过滤事项，ESC 清除过滤关键字。

 五、其它功能
 1、“编辑事项” 时显示操作提示；
 2、列表中有标记“已完成”的事项时，“清除所有已完成” 才能显示；
 3、列表中有事项时，才显示 “全部标记已完成”；
 4、统计数字根据关键字过滤的结果进行统计。

 前端：
 第一次迭代 “待办事宜” 大组件
 第二次迭代 拆分组件，组件间的通讯
 第三次迭代 利用事件总线进行组件组件间通讯
 第四次迭代 利用数据仓库共享数据、管理状态