erha blog

Web API介绍API的概念API（Application Programming Interface，应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，无需理解其内部工作机制细节，只需直接调用使用即可。 举例解释什么是API。 例如， ​ C语言中有一个函数 fopen()可以打开硬盘上的文件，这个函数对于我们来说，就是一个C语言提供的打开文件的工具。 ​ javascript中有一个函数alert()可以在页面弹一个提示框，这个函数就是js提供的一个弹框工具。 这些工具（函数）由编程语言提供，内部的实现已经封装好了，我们只要学会灵活的使用这些工具即可。 Web API的概念​ Web API 是浏览器提供的一套操作浏览器功能和页面元素的 API ( BOM 和 DOM )。 ​ 主要针对浏览器做交互效果。比如我们想要浏览器弹出一个警示框， 直接使用 alert(‘弹出’) ​ MDN 详细 API : https://developer.mozilla.org/zh-C ...

安装ElementUI官方文档 1npm i element-ui -S 快速上手12345678910111213141516// main.jsimport Vue from 'vue';import App from './App.vue';import router from './router';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.config.productionTip = false;Vue.use(ElementUI);new Vue({ router, render: (h) => h(App),}).$mount('#app'); 官网组件 随便复制一个123456789101112131415161718192021<!-- Home.vue --><templa ...

怎么调用兄弟组件的方法?参考自 百度经验 Vue2的方法 第一种: eventBus 新建一个js文件， 我这里叫做 bus.js； 123// bus.jsimport Vue from 'vue'; export default new Vue(); 123// 触发的组件import bus from '文件路径'执行：bus.$emit('触发名称', 传输的数据) 1234567// 通信的组件import bus from '文件路径'mounted(){ bus.$on('触发名称', res => { //写你需要的方法 })} 第二种：直接在 main.js中 直接如下 12345678910new Vue({ el:'#app', router, template:'<div>${msg}<App/&g ...

创建项目配置 全局安装Vue脚手架 查看是否安装成功 创建项目 选择手动配置 选择的配置 选择2.x 3.x是预览版 选择的配置 运行 public 和 src/assets 的区别：在打包时，public下的资源直接移到目标目录，而src/assets下的资源会经过打包处理 ESLint插件 是专门用来检查咱们代码规范的（帮我训练强迫症）： 默认不用写分号 默认必须是单引号 代码风格检查配置 在vscode中搜索prettier，卸载 Prettier - Code formatter 插件，安装Prettier+插件 右击任意一个*.js文件，选择格式化使用….，配置默认格式化插件 点击Prettier+插件的齿轮配置，在顶部输入框中加空格再加下面的关键字 semi：分号（默认加上，不用改） single：单引号（默认双引号，需要改下，勾上） comma：对象或数组的最后一项，是否加逗号（默认是加上的，不用改） 顺便安装一个图标主题插件：vscode-icons 再安装一个 ESLint 和 Vetur 插件 ESLint插件 是专门用来检查咱们代码规范的 ...

Vue介绍 作者: 尤雨溪 Vue是一款渐进式JavaScript框架，通过简洁的API提供高效的数据绑定和灵活的组件系统。 渐进式：声明式渲染 — 组件系统 — 客户端路由 — 集中式状态管理 — 项目构建 Vue 的核心库只关注视图层 官方文档 Vue安装1234567<!-- 兼容性: Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的浏览器。 --><!-- 开发环境版本，包含了有帮助的命令行警告 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><!-- 生产环境版本，优化了尺寸和速度 --><script src="https://cdn.jsdelivr.net/npm/vue"></script> 声明式渲染Vue.js 的 ...

项目基本结构 iconfont-阿里巴巴矢量图标库 直接在/public/index.html里面引入样式 一种方式是将 SVG 图标 包装为 Vue 组件来使用。 一种方式是将 SVG 制作为字体图标来使用： 使用 Vant.js 移动端组件库1、安装 Vant 1npm i vant 2、在 main.js 中加载注册 Vant 组件 12345import Vue from 'vue'import Vant from 'vant'import 'vant/lib/index.css'Vue.use(Vant) 3、查阅文档使用组件 移动端REM适配一、使用 lib-flexible 动态设置 REM 基准值（html 标签的字体大小） 1、安装 12# yarn add amfe-flexiblenpm i amfe-flexible 2、然后在 main.js 中加载执行该模块 1import 'amfe-flexible' 最后测试：在浏览器中切换不同的手机设备尺寸，观察 html 标 ...

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用 集中式 存储管理应用的所有组件的状态，并以相应的规则保证状态以一种 可预测 的方式发生变化。vuex是采用集中式管理组件依赖的共享数据的一个工具，可以解决不同组件数据共享问题。 修改state状态必须通过**mutations** **mutations**只能执行同步代码，类似ajax，定时器之类的代码不能在mutations中执行 执行异步代码，要通过actions，然后将数据提交给mutations才可以完成 state的状态即共享数据可以在组件中引用 组件中可以调用action 初始化:123456789101112npm i vuex --save // 安装到运行依赖// 在vue脚手架中使用// main.jsimport Vue from 'vue'import Vuex from 'vuex'Vue.use(vuex)const store = new Vuex.Store({})new Vue({ el: ' ...

路由的本质就是一种对应关系，比如说我们在url地址中输入我们要访问的url地址之后，浏览器要去请求这个url地址对应的资源。那么url地址和真实的资源之间就有一种对应的关系，就是路由。后端路由 概念：根据不同的用户 URL 请求，返回不同的内容 本质：URL 请求地址与服务器资源之间的对应关系 前端路由 概念：根据不同的用户事件，显示不同的页面内容 本质：用户事件与事件处理函数之间的对应关系 SPA（Single Page Application） 后端渲染（存在性能问题） Ajax前端渲染（前端渲染提高性能，但是不支持浏览器的前进后退操作） SPA（Single Page Application）单页面应用程序：整个网站只有一个页面，内容的变化通过Ajax局部更新实现、同时支持浏览器地址栏的前进和后退操作 SPA实现原理之一：基于URL地址的hash（hash的变化会导致浏览器记录访问历史的变化、但是hash的变化不会触发新的URL请求） 在实现SPA过程中，最核心的技术点就是前端路由 Vue Router Vue Router 是 Vue.js 官方的路由管理器。 它和 Vu ...

promise原文地址 要实现Promise对象首先我们要了解Promise拥有哪些特性，简单概括为以下几点1、Promise有三种状态：pending(进行中)、fulfilled(已成功)、rejected(已失败)2、Promise对象接受一个回调函数作为参数, 该回调函数接受两个参数，分别是成功时的回调resolve和失败时的回调reject；另外resolve的参数除了正常值以外， 还可能是一个Promise对象的实例；reject的参数通常是一个Error对象的实例。3、then方法返回一个新的Promise实例，并接收两个参数onResolved(fulfilled状态的回调)；onRejected(rejected状态的回调，该参数可选)4、catch方法返回一个新的Promise实例5、finally方法不管Promise状态如何都会执行，该方法的回调函数不接受任何参数6、Promise.all()方法将多个多个Promise实例，包装成一个新的Promise实例，该方法接受一个由Promise对象组成的数组作为参数(Promise.all()方法的参数可以不是数组， ...

1--save // 添加到依赖项