⑴ Vue.js里使用axios Vue.prototype.$axios = Axios是什么意思啊 没有系统学vue麻烦指点一下
给Vue函数添加一个原型属性$axios 指向Axios
这样做的好处是在vue实例或组件中不用再去重复引用Axios 直接用this.$axios就能执行axios 方法了
⑵ 2020年11大顶级VueJS开发工具
Vue JS 最近变得越来越流行,主要是因为它在学习和开发应用程序方面都提供了很多便利。选择正确的工具非常重要,这能帮助你快速构建出色的应用,而无需重新发明轮子。
在为这个列表挑选工具时,我们考虑了整个 Vue JS 的开发周期。从为你的新应用程序设置样板开始,我们涵盖了重要应用程序概念、调试甚至测试内容。
1. Vue CLI
Vue CLI 工具使你可以快速创建项目结构并部署样板。它还允许你创建实时原型来演示新功能。除了常见的功能外,Vue CLI 还提供了许多额外内容,比如对一众 Web 开发工具的支持,包括 TypeScript、Babel、PostCSS、ESLint、单元测试、PWA 和端到端测试等。它与社区创建的可扩展第三方插件相兼容。
Vue CLI 的另一个好处是它不需要弹出。换句话说,Vue CLI 与其他框架相比有更大的自定义空间。Vue CLI 的图形用户界面是其最重要的特性之一,可让你方便地创建新项目并管理它们。
2. Nuxt JS
Nuxt 有一个模块化架构,并拥有 50 多个模块,可以加快你的开发流程。这些模块支持的任务类型众多,例如引入 PWA、添加 Google Analytics 或生成站点地图等。它通过自己的包分析器实现了 Vue JS 和 Node.JS 的最佳实践,提供了开箱即用的性能调优。
3. Bit for Vue
Bit 是为团队构建下一代 Vue 组件库的好方法。它解决了跨存储库共享和协作处理 UI 组件的问题。你可以将 UI 与共享组件(独立开发、版本控制和更新)组合在一起。在 bit.dev 平台中托管和组织组件,从任何新项目中搜索、渲染、安装甚至更新任意组件。平台提供了许多开箱可用的功能,包括自动组件文档、渲染沙箱等。
4. Vue-router
Vue-router 在路由器概念上做得很好,支持基于组件的路由器配置。它还支持路由器参数、查询和通配符,以支持复杂的路由。与其他框架相比,它提供的了过渡效果等特性,使更改路由的过程对用户更加友好;它还提供了带有活动 CSS 类的链接,从而带来了更多可能性。
5. Vuex
Vuex 集中了所有状态管理函数,并仅允许状态以可预测的方式突变,从而更好地解决状态管理问题。它允许基于状态、视图和动作进行突变。状态定义有关应用程序的事实;视图向用户显示这些事实,而动作会导致状态更改,从而重新启动突变周期。Vuex 还提供了诸如零配置时间旅行调试和状态快照导出 / 导入等功能。
6. Axios
Axios 是一个流行的第三方库,用于创建和管理 ajax 请求。Vue 使用 Axios 作为其首选的 ajax 库。尽管 Axios 不是官方 Vue 存储库的一部分,但它具有通用性、支持取消功能并具有 TypeScript 定义。使用 Axios 时要注意的一点是,如果你的服务器本身不支持 Promise,则需要自己提供一个 polyfill。
7. Vuetify
Vuetify 是一个精美的手工挑选的 UI 组件库,能让你的应用程序获得优美的 Vue 体验。它提供了 80 多个基于 Material Design 规范的组件,并通过其 Vue CLI 插件提供了现成的项目骨架。SSR 支持也是内置的。这些组件包括警报、Banner、Badge、按钮、表单输入和控件,还有进度小部件等。
8. Vue Apollo
Vue Apollo 是将 GraphQL 用于 Vue 的最便捷方法之一。它能够以一种真正的声明方式来使用 GraphQL。Apollo 的核心是为后端应用程序提供一个 Schema 语言,同时为前端提供一个查询语言,以便进行数据交换。它还支持 SSR,这样你就可以在服务端渲染 HTML 了。
9. Mocha
Mocha 是一个强大的测试框架,适用于所有当前和过去的 Vue 版本。它既可以通过 Node.JS 在后端运行,也可以在前端运行,这使得异步测试既方便又有意义。Mocha 还提供了将未捕获的异常映射到 GitHub 上相关测试用例的能力,这样就更容易跟踪和解决它们了。
10. Vue.js DevTools
Vue.js DevTools 是调试 Vue 应用程序的关键工具,提供了适用于 Firefox 和 Chrome 的插件,还有适用于任何环境的一个独立的 Electron 应用。浏览器插件将“Vue”选项卡添加到其原生开发工具实现中,从而使调试体验变得更加流畅,对用户更友好。
11. 官方 Vue.js 指南
官方 Vue.js 指南适用于所有当前和过去的 Vue 版本,因此无论你是刚开始入门,还是希望改进或扩展基于旧版本 Vue 的已有应用程序,都可以从本指南中获益良多。你还可以通过版本历史轻松对比组件的更改方式。此外,指南还内置了视频、代码段和交互式应用程序,以使其更具交互性且更易理解。指南的最后一部分提供了与其他框架(例如 React 和 Angular)的详细对比。
总结,这些工具可以让你的 Vue 开发流程效率更高。我们希望本文能勾起你学习 Vue 的兴趣,或者如果你已经熟悉 Vue 了,也可以尝试其中一些工具。无论你是刚刚入门还是经验丰富的开发人员,这些工具都可以帮助你。
⑶ vue.js 怎么引入axios
首先在 main.js 中引入 axios
?
1
import axios from 'axios'
这时候如果在其它的组件中,是无法使用 axios 命令的。但如果将 axios 改写为 Vue 的原型属性,就能解决这个问题
Vue.prototype.$ajax = axios
在 main.js 中添加了这两行代码之后,就能直接在组件的 methods 中使用 $ajax 命令
methods: { submitForm () { this.$ajax({ method: 'post', url: '/user', data: { name: 'wise', info: 'wrong' } })}