liangxiaojuan/vue-todos

vue最新实战项目教程，从零开始，一步一个脚印,循序渐进。跟着我一起学习vue吧！

vue-todos

预览地址(响应式设计，pc端，移动端) 首发地址(源码和教程)

vue-todos是 todomvc vue模块的升级版本,界面简约，功能丰富，知道点全面，能帮您快速上手vuejs.喜欢的请点心，关注，star ,fork,这些是我坚持下去的动力!!

前言

vuejs是一个好的开源项目，大大释放了我们的生产力。使用vue2年，不仅让我升职加薪，更让我的前端技术有了大的进步。 在各大vue群，各大论坛混了很久了，解答了不少的vuejs小白问题。发现很多问题vueApi文档都是api不够理解的原因，糟糕的是很多人不喜欢查阅文档，而且由于练手机会少，所以在遇到问题的时候很无措。

希望

本课程会带大家从零开始实战vue,希望通过此课程能够使初学者门能够快速的上手vuejs,快速的学习使用vue常用的api.让vue.js的初学者们循序渐进的，有效的学习vuejs.

运行

# 更新依赖包
npm install
# 本地运行 at localhost:8080
npm run dev
# 打包
npm run build

你将学习到

• vue-cli 开发环境的搭建
• 分析api文档，组件化编程
• vue基础( 1.实例 2.组件 3.指令 4.选项 5.模板渲染 6.事件绑定 7.计算属性 8.内置动画 9.组件交互 10.内置路由)
• vue进阶(1.vue生命周期 2.vuex使用 3.axios的使用 4.mock.js 前端模拟数据)
• 跨域问题的解决办法

图片预览

*pc端

课程目录(请保持关注,一天更新一小节)

• 开发环境搭建
  • Node.js的安装
  • vue-cli的安装
  • 创建第一个vue应用
• todomvc升级版实战开发]
  • 前期准备
    • 项目分析
    • 需求分析
    • api分析
    • 组件分析
  • 响应式布局
  • 组件编写
    • 菜单组件
    • 头部组件
    • 列表组件
  • 菜单
    • api.js(axios.js)编写
    • 绑定菜单数据
    • 新增菜单
  • 头部
    • 绑定单条数据
    • 新增列表
    • 修改标题
    • 删除内容
  • 列表
    • 完成代办项
    • 修改代办项
    • 删除代办项
  • 锁定
    • 锁定代办项
  • vuex
    • 菜单数据更新
    • 移动端菜单收缩
  • 过渡动画
    • 菜单动画
    • 列表动画
• vue.js知识点讲解

vue-todos's Issues

README.md里的组件分析链接错了

hi，老铁：
README.md里的"组件分析"链接错了。

mock.js问题

1. 如果是产品服务器的话, 是否需要修改源码将 mock 去掉?
2. mock.js的引入对 webpack 打包(产品环境)有什么样的影响?
3. 下面这样的写法有意义吗?

if (process.env.NODE_ENV === 'development') {
  const Mock = require('./mock');
  Mock.start();
}

Cannot read property 'record' of undefined

文档写的非常棒，很好，学习了，非常感谢。
下面有一个小问题：
app.1305534f823567d76d8d.js:1 Uncaught (in promise) TypeError: Cannot read property 'record' of undefined
at Array. (app.1305534f823567d76d8d.js:1)
at o (vendor.2f2c77d66a53508c9986.js:17)
at vendor.2f2c77d66a53508c9986.js:17
at new Promise ()
at i. (vendor.2f2c77d66a53508c9986.js:17)
at t.exports (vendor.2f2c77d66a53508c9986.js:17)

请问是否有意愿将项目升级成 TypeScript 项目？

@liangxiaojuan 如果有意愿的话，我可以效劳，我将提交 PR，在不改变项目原本功能和构建打包的前提下，单纯将 JavaScript 改成 TypeScript，相关的 xx.js 将改成 xx.ts，xx.vue 中的 <script> 将改成 <script lang="ts">

你博客网站http://yangyi1024.com/挂了，打不开了

第一次运行没有数据拉取到

大神，我把您的项目clone下来，运行后，怎么是“ GET http://localhost:8080/ 404 (Not Found)”，有没有一个简版可以运行的

自己发现的一些小错误勘误

1.教程里 https://juejin.im/post/5933a0beac502e00689e277d#heading-24
3.1.9 列表渲染少了这一行，导致整体效果失效

查看怎么无法添加todolist呢

图标出不来，less可以加载

麻烦 楼主看看哈，给个解释

博客的文章里面很多图片刷不出来。。。。

感谢作者分享，学习了。。。。
能更新下博客文章图片链接吗？

笔误

http://yangyi1024.com/2017/06/14/%E5%AD%A6%E4%B9%A0%E4%B8%8D%E4%B8%80%E6%A0%B7%E7%9A%84vue4:mock%E4%B8%8Eaxios%E5%AE%9E%E6%88%981/

最后一段代码

<template/>

=>

</template>

图标出不来是啥原因？

可以加个定时提醒！

怎么不更新了

感觉挺好的，想跟着大神学一下

Readme中学习文档的链接失效了

作者还在维护这个仓库吗，文档里的链接都失效了

id 小问题

访问localhost;8080/ 不报这个错，访问 localhost:8080/#/todo/id 报这个错
Uncaught (in promise) TypeError: Cannot read property 'id' of undefined

多来点 这种基础项目 带讲解的

么么哒

字体图标可以再大点！

字体图标可以再大点！

到 3.1.7 修改router(路由) 就不能顺利的构建了

到 3.1.7 修改router(路由) 用npm run dev 就会报错了。
1.git clone 你的源码，运行npm run dev 也报错。
2.最好能在文章的开头，说一下 你的运行版本和运行环境。要不同版本会有一点差异。

运行你的源码，报错如下：

[email protected] dev D:\VsCode\vue-todos
node build/dev-server.js

module.js:559
throw err;
^

Error: Cannot find module 'chalk'
at Function.Module._resolveFilename (module.js:557:15)
at Function.Module._load (module.js:484:25)
at Module.require (module.js:606:17)
at require (internal/module.js:11:18)
at Object. (D:\VsCode\vue-todos\build\check-versions.js:1:75)
at Module._compile (module.js:662:30)
at Object.Module._extensions..js (module.js:673:10)
at Module.load (module.js:575:32)
at tryModuleLoad (module.js:515:12)
at Function.Module._load (module.js:507:3)

第四节课 路由少引入了个todo组件

第四节课 路由少引入了个todo组件

路径 src/components/Item.vue 文件名第一个字符大写 命名错误 导致无法npm run dev

路径 src/components/Item.vue Item.vue 文件名第一个字符为大写
但文件 src/components/todo.vue 的64行为 import item from './item';

导致报错信息

ERROR in .//babel-loader/lib!.//vue-loader/lib/selector.js?type=script&index=0!./src/components/todo.vue
Module not found: Error: Can't resolve './item' in '/home/rango/code/vue-todos/src/components'

图标问题

请问为什么图标加载不出来？完全是按照教程上所写的

您的域名失效了，想学习，卑微

很棒

在你的文章中没有发现留言，在这里表达一下对作者的赞许之情。写得太好了，循序渐进很适合学习。希望作者能创作出更好的作品。

写的很好，期待更新！

https://github.com/liangxiaojuan/vue-todos/blob/master/src/mock/mock.js#L64

Originally posted by @thoth-hank in #16 (comment)

Readme中的文档链接失效，有没有文档目录？？

Readme那里的教程文档链接都失效了，这个仓库又找不到文档在哪
想学习啊

linux can't run dev

有2个插件不支持linux,跑不起来