美文网首页IT@程序员猿媛
Vue 开发起步指南

Vue 开发起步指南

作者: 敬亭阁主 | 来源:发表于2020-08-22 16:50 被阅读0次

必须通读的文档

Vue 2.x 核心文档

Vuex 状态管理文档

Vue router 路由文档

Vue 风格指南

Vue Cli 文档

扩展功能

通过 @vue/composition 这个库,它已经以插件的形式在 2.x 中生效了,这一套 API 将内建在 Vue 3.0 中,它将与现有的 2.x 选项同时可用。

组合式API 意见征求稿

快速上手企业级中后台实例

使用Antd vue构建的Pro案例:Github: ant-design-vue-pro

首先安装vue cli

yarn global add @vue/cli

然后下载代码库

git clone --depth=1 https://github.com/vueComponent/ant-design-vue-pro.git vue-pro-starter
cd vue-pro-starter

启动

yarn serve

这时候就可以用浏览器访问如下地址

http://localhost:8000/
示例

写给React开发者

  1. vue更偏向传统html/js开发模式;react更希望有优雅的开发感受

  2. vue倾向于官方力量发展,可用的基本都是官方发布的插件;react借助社区的力量发展,尤其是国内大厂贡献了非常好的组件(dva、umijs等)

  3. Template vs jsx,受限于传统DOM,vue中各种PascalCase、camelCase和kebab-case的变化容易让人感觉混淆,directive的使用也会比较费劲,但如果开发者拥有足够的想象力,的确能够大大降低了代码的复杂度;react的render函数相对来说要优雅得多,但是比较拘谨,解决方案中规中矩

  4. 属性,vue中的属性分为data、props、computed和state,分别有各自相对独立的定义方法和调用方式,可用于不同的应用场景,同样对于开发者来说,入手容易,进阶则比较困难;react的属性包括props和state,其中props又可包含了上级组件导入的props和由state映射后inject的props,但要实现类似compted的功能,需要用到最新的hooks方案

  5. 方法,vue中的方法包括watch、methods;react中对应watch的就是hooks方案,methods则不需要明确指定

  6. slot vs children,从功能上来看,这两者是类似的,vue的slot更灵活,react的children更简洁

  7. composition api vs hooks,两者的目标都是将代码从关注组织结构转换为关注业务逻辑,并提供和this对象的解耦,从而能够更高效地进行组件的抽象和复用,但目前vue还不建议在生产环境下使用新特性

总的来看,vue属于入手简单,但进阶困难的框架,大量的概念和底层API的暴露使得最佳实践非常困难,很容易就进入了各自为战的混乱编码阶段,因此对于开发人员的要求反而更高,但与此同时,一个高水平的vue开发人员则能够开发出非常好的代码,这也是vue的魅力所在;react更中规中矩一些,大量的社区辅助工具的出现使得开发规范变得更加标准化,提高下限的同时也限制了上限,使用react入手需要学习的内容多一些,但最终其实需要了解的东西并不比vue多。

本来想举一些例子,但是想想还是算了,挂一漏万,还是不要多此一举了。

相关文章

网友评论

    本文标题:Vue 开发起步指南

    本文链接:https://www.haomeiwen.com/subject/rqaujktx.html