You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
UC浏览器、稀土掘金、
滴滴, 还出了一本书 Vue.js 权威指南
饿了么,开源了一个基于Vue的UI库 GitHub - ElemeFE/element: Desktop UI elements for Vue.js 2.0
阿里的 weex GitHub - alibaba/weex: A framework for building Mobile cross-platform UI
GitLab选择了Vue https://about.gitlab.com/2016/10/20/why-we-chose-vue/
荔枝FM,移動端部分使用Vue
B 站的三个项目 (•̀ω•́ 」∠):
圈子:哔哩哔哩兴趣圈,二次元兴趣交友社区
直播(仅首页与活动页):哔哩哔哩直播,二次元弹幕直播平台
周边商城:bilibili-周边商城
集Vue+TyleScript+Webpack+...开发的资源流水线
Vue+
Vue是东西呢?http:https://cn.vuejs.org/
从Vue2.0开始吧,之前有用过Vue1.0+。
由尤雨溪开发并维护的前端框架,在这两年2015、2016国内大大被重用和提起。
Vue 2.0 中文版
在国内有些大公司已经引进Vue来处理业务:
UC浏览器、稀土掘金、
滴滴, 还出了一本书 Vue.js 权威指南
饿了么,开源了一个基于Vue的UI库 GitHub - ElemeFE/element: Desktop UI elements for Vue.js 2.0
阿里的 weex GitHub - alibaba/weex: A framework for building Mobile cross-platform UI
GitLab选择了Vue https://about.gitlab.com/2016/10/20/why-we-chose-vue/
荔枝FM,移動端部分使用Vue
B 站的三个项目 (•̀ω•́ 」∠):
圈子:哔哩哔哩兴趣圈,二次元兴趣交友社区
直播(仅首页与活动页):哔哩哔哩直播,二次元弹幕直播平台
周边商城:bilibili-周边商城
上面的信息基本来自知乎》https://www.zhihu.com/question/33264609
更新项目
简书
饿了吗
网易云音乐
知乎日报
Node爬虫接口: https://ecitlm.github.io/SpliderApi/#/
开始Vue
已经在知乎发表了一篇文章 新手向:Vue 2.0 的建议学习顺序
我在这里就加几点:
好啦~~~
一般其实呢
最重要的就是会排查错误和查找问题,也要会最新资讯。
npm 和cnpm 的关系
sass、node-sass 在npm install的时候为什么老是错误
翻墙和网络好
哈哈哈,看到下面有人评论:Vue 不难学,难的是配置 Webpack……哈哈。
所以在学前端的时候,还需要学浏览器、 HTTP、数据、网络 ...
更类似的东东
之前很久之前就是JSP,有看过、接触过JSP的同学们都知道
JSP 的语法就是在HTML里加入自定义的东西和加入了动态语言
哦,好吧,我们就说MVC模式,还有MVVM模式............
哎呀,可能早期还会接触到backbone框架的人,或者已经不是很重要了
重要的是接触过angular的人,这一下就会更加很好非常棒地.....
就是很棒,别说了
我想说的就是:
一步一步来...
Vue 基础
有个Vue社区 http:https://www.vue-js.com/
2.0中文社区,上面有提到,再来再次给出《Vue 2.0 中文版》
看一下2.0的API:https://vuefe.github.io/api/
组件
vue-router
来,链接在这里:vue-router 2
路由对象和路由匹配
路由对象,即$router会被注入每个组件中,可以利用它进行一些信息的获取。如
路由选项
如,我想采用一个有路径格式化并启用Html5 history功能的路由器,则可以在路由器初始化的时候,指定这些参数:
请暂时参考这篇文章VueJs路由跳转——vue-router的使用
注意项
1、声明式:router-link :to="..." || 编程式:router.push(...)
这个方法会向 history 栈添加一个新的记录
2、声明式:router-link :to="..." replace || 编程式:router.replace(...)
不会向 history 添加新记录,替换掉当前的 history 记录
3、router.go(n)
4、操作 History
命名路由 和 命名视图
命名路由就是在路由加个 name 的标签
命名视图就是在视图加个 name 的标签,可以设置默认值
重定向 和 别名
重定向:内部跳转
别名:保持当前路由去访问另一个路由
这个给个链接自己去玩 http:https://router.vuejs.org/zh-cn/essentials/history-mode.html
因为这个比较复杂和需要后台来配合...
导航钩子(路由ing锁)
正如其名,vue-router 提供的导航钩子主要用来拦截导航,让它完成跳转或取消。有多种方式可以在路由导航发生时执行钩子:全局的, 单个路由独享的, 或者组件级的。
来来来:http:https://router.vuejs.org/zh-cn/advanced/navigation-guards.html
路由元信息 (就是标志过滤处理)
过渡动效 ...
数据获取
1、导航完成之后获取:先完成导航,然后在接下来的组件生命周期钩子中获取数据。在数据获取期间显示『加载中』之类的指示。
2、导航完成之前获取:导航完成前,在路由的 enter 钩子中获取数据,在数据获取成功后执行导航。
滚动行为
注意: 这个功能只在 HTML5 history 模式下可用。
路由懒加载
说白了就是模块化加载
结合 Vue 的 异步组件 和 Webpack 的 code splitting feature, 轻松实现路由组件的懒加载。
Vuex 状态管理
登录状态,信息储存、暂存,操作状态。
有空可以去解读源码:http:https://vuex.vuejs.org/en/index.html
有中文版: https://segmentfault.com/a/1190000007108052
Vue-loading
Vue-resource
动画过渡
http:https://vuejs.org/guide/transitions.html
项目目录
webpack
Vue-cli 构建工具
还需要一些周边知识
Node+npm Es6 Sass webpack gulp
项目
豆瓣API 聚合数据
The text was updated successfully, but these errors were encountered: