VUE
Mary Ling
12年毕业至今,拥有5年的大型游戏公司的游戏后台开发经验,后转做web后台应用,对高并发多线程有着相当的经验,喜欢探索新的知识,研读源码框架。
展开
-
Vue种NProgress用法
//TODO原创 2022-03-26 14:57:12 · 676 阅读 · 0 评论 -
Vue基本概念
1.vue标签vue 对象el: 元素的挂载位置(值可以是css选择器或者DOM元素)data: 模型数据(值是一个对象)插值表达式将数据填充到HTML标签中插值表达式支持基本的计算操作Vue编译过程(Vue代码 --> 原生语法)前端渲染把数据填充到html标签中Vue模板语法1.插值表达式2.指令3.事件绑定4.属性绑定5.样式绑定6.分支循环结构vue指令指令的本质是自定义属性指令的格式:以v开头(如v-cloak)v-cloak用法1.解决插值表达原创 2022-03-26 14:55:20 · 464 阅读 · 0 评论 -
一文了解vue基本概念
vue export跟export default的区别相同点:vue export跟export default均可用于导出常量,函数,文件,模块等等都可使用import导入不同点:同一个文件export可以有多个, export default只能有一个通过export方式导出,在导入时要加{}, export default则不需要。使用export default为模块...原创 2022-03-23 20:27:37 · 196 阅读 · 0 评论 -
vue dev环境API代理实现
基本描述如果你的前端应用和后端 API 服务器没有运行在同一个主机上,你需要在开发环境下将 API 请求代理到 API 服务器。这时候我们就需要使用API代理了。代码实现devServer.proxy 可以是一个指向开发环境 API 服务器的字符串:如下,将所有没有匹配到静态文件的请求代理转发到http://localhost:4000module.exports = { devServer: { proxy: 'http://localhost:4000' }}根据不同ap原创 2022-03-23 20:25:43 · 1824 阅读 · 0 评论 -
Vue Store用法大全
Vue Store架构从上述架构图可知,Vue组件通过调用dispatch()方法操作某个Action, 然后Action回操纵Mutation, 然后由Mutation操作State中的数据,而State中的数据改变之后,同时去改变Vue中的组件基本用法import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex)const store = new Vuex.Store({ state: { //用于存放数据 coun原创 2022-03-23 20:25:05 · 7623 阅读 · 0 评论 -
Axios实例的使用实践
通过npm安装模块npm install axios --save引入axiosimport axios from 'axios'编写request.js创建axios实例import axios from 'axios'import router from '@/router/routers'import { Notification, MessageBox } from 'e...原创 2020-05-05 21:51:14 · 1186 阅读 · 0 评论 -
Axios用法详解
基本介绍Axios是一个异步的http框架,可以在浏览器和nodejs中使用特征从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRF全局方法axios.request(config)axios.get(url[, con...原创 2020-05-05 21:09:26 · 754 阅读 · 0 评论 -
npm install相关参数详解
查看当前npm配置全局安装还是本地安装运行npm config ls查看当前配置从红色画线处可知,当前npm配置的是本地安装,即所有install的module都将位于项目的node_modules处。如果此处global为true,但我们又希望本地安装的话我们可以通过修改.npmrc文件的global为false(具体路径见:userconfig后面的绝对路径)安装参数详解命...原创 2020-05-04 18:09:25 · 5256 阅读 · 1 评论 -
Vue路由懒加载
为啥需要懒加载当一个vue项目很大的时候,使用webpack打包会导致第一次加载时间太快,这样可以导致首次加载白屏情况,给用户更好的体验,即vue路由的懒加载。非懒加载方式实现import HelloWorld from '@/components/HelloWorld' export default new Router({ routes: [ { path: ...原创 2020-05-03 21:57:07 · 122 阅读 · 0 评论 -
一文了解vue基本概念
Vue实例Vue实例是Vue应用的启动器,对于SPA(Single Page Web Application),只会创建一个Vue根实例。当我们实例化一个Vue实例时,需要传入选项对象,可包含data(数据相关), template(模板),el(挂载元素), methods(方法)与生命周期钩子函数(created, mounted…)等等,具体可见Vue选项对象。new Vue({ ...原创 2020-05-03 12:30:31 · 977 阅读 · 0 评论 -
Vue Router参数大全
Vue Router对象创建Vue Router构建选项详解参数类型默认值可选值描述routesArray配置路由规则modestring“hash” (浏览器环境) /“abstract” (Node.js 环境)“hash”/“history” / “abstract”配置路由模式basestring/应用的基路径lin...原创 2020-05-03 10:31:21 · 7013 阅读 · 0 评论 -
npm常用命令汇总
1.安装包相关命令描述npm get global查看当前默认的安装模式,如果为true,则为全局安装模式,否则为本地安装模式npm set global=true设置全局安装模式npm install根据package.json文件安装npm install 包名本地安装,在npm运行目录下安装npm install 包名@1.x安装指...原创 2020-05-01 21:17:14 · 195 阅读 · 0 评论 -
windows环境npm安装
去nodejs官网下载windows版本的包官网: https://nodejs.org/en/download/根据自己电脑的系统选择32-bit或者64-bit的安装包安装nodejs检查nodejs安装成功检查npm安装成功检查npm配置信息...原创 2020-04-30 12:39:02 · 6261 阅读 · 0 评论 -
Vue环境搭建
一. 安装npm1. 去nodejs官网下载页面下载相应版本的nodejshttps://nodejs.org/en/download/2. 验证npm是否安装成功 npm -v二. 安装cnpm1. 由于npm服务器位于国外,可能会影响安装,而cnpm是淘宝针对npm做的国内镜像,目前是每10分钟与npm服务器进行一次数据同步2. npm install c...原创 2020-02-24 18:05:53 · 111 阅读 · 0 评论