- 博客(40)
- 问答 (1)
- 收藏
- 关注
转载 axios的传参方式
或者直接把参数拼接在地址后面。delete和get一样。注解,不然接收不到参数。还有一种情况是后端用。put和post一样。
2022-08-08 15:31:16 5801
原创 在vue项目中QQ登录,增加dns解析(webpack环境)
第一步 : 在host文件中配置,增加网址解析(因为qq返回需要是个网址)第二步:在vue.js文件中增加配置第三步:在组件中引入第四部:在根html文件中引入
2022-07-06 12:10:03 781
原创 解决npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dep
在使用npm下载包的时候,经常出现百度翻译了一下:npm错误!代码解析npm错误!ERESOLVE无法解析依赖关系树查阅相关资料后说原因是:安装的包与已经存在的包有冲突。使用npm install xxx -- force或者npm install xxx --legacy-peer-deps(推荐)来安装。例如需要下载样式初始化文件包:原本命令: npm install normalize.css --save解决方案命令: npm install normalize.css --save --legac
2022-07-01 12:03:02 1178
转载 vue项目中如何做到less文件的自动化导入
因为是vue脚手架的插件,不是一个包,所以我们这里的命令有些变化 安装完毕之后项目目录下会出现一个新的文件把需要注入的文件配置一下后,重启服务即可
2022-07-01 11:25:41 641
原创 将全局注册组件进行封装
由于main.js里面全局注册内容太多,将全局注册的组件全部进行一个封装,因此,在main.js里面只需要引入一个文件,其他全局注册的组件全部都封装在了一个文件里面。: 利用 统一全局注册组件文档: https://cn.vuejs.org/v2/api/#Vue-use说明:Vue.use 可以接收一个对象, Vue.use(obj)对象中需要提供一个 install 函数,(这个install函数会自动执行)install 函数可以拿到参数 Vue, 且将来会在 Vue.use 时, 自动调用该 in
2022-06-02 14:50:12 154
原创 vue-element-admin管理系统架子,让你事半功倍
完整版的架子:一个成熟的集成方案# 克隆项目git clone https://github.com/PanJiaChen/vue-element-admin.git# 进入项目目录cd vue-element-admin# 安装依赖npm install# 建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题npm install --registry=https://registry.npm.taobao.org# 本地开发
2022-05-24 11:52:45 315
原创 将图片转化成base64格式
// 如果用户选择了图片就将图片转化为base64位的格式进行存储和使用 // 第一步:先读取文件 const base = new FileReader() // console.dir(base) // 第二步:将需要转化的图片放进去 base.readAsDataURL(e.target.files[0]) // 第三步:获取结果, 因为文件加载需要时间,因此是个异步的过程,需要使用onload去获取读取的结果,读取转化后的结果放在.
2022-05-23 22:58:50 10763
原创 图片数据发送前预览
js内置了一个URL,将图片地址转化成网络地址,使得img标签直接通过src属性引入预览,代码如下:// e.target.files[0] 这里的是自行选择的照片const url = URL.createObjectURL(e.target.files[0])this.$refs.img.src = url// 此时url是一个http的地址:blob:http://localhost:3005/1caf9ad9-f4df-4362-b711-7f680eb0b2a3...
2022-05-23 22:52:29 77
原创 axios请求头增加身份验证(增加token)
import axios from 'axios' // 配置请求的根路径 axios.defaults.baseURL = 'http://localhost:3000/api' // 为每次请求添加请求拦截器,为请求头添加authorization属性 axios.interceptors.request.use((config) => { // console.log(config); config.headers.Authorization = SessionStor.
2022-05-17 15:04:33 1053
原创 vuex(集中式管理数据状态方案)
是什么:vue官方提供的独立于组件体系之外的,管理公共数据的工具1、安装及使用安装如果是老项目的话就需要手动下载第一步:npm i vuex@3.6.2 (支持vue2的版本,vue3不用加版本号)第二步:在src文件夹里创建一个store文件夹,里面创建一个index.js文件,文件内容如下:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({
2022-05-12 21:04:51 203
原创 Vue-路由
前提了解:单页应用:所有功能在一个页面上实现多页应用:与单页应用相对应的,不同的功能通过不同的页面来实现单页面-多页面对比:正式学习1、什么是路由?是什么:就是一一对应关系的集合前端路由(单页应用程序): 一个url地址,对应哪个组件 后端路由:一个接口地址,对应哪一段接口地址2、工作原理前端路由工作原理:前端路由的本质, 对url的hash值进行改变和监听,切换对应页面组件的dom结构根据地址栏变化(不重新向服务器发请求),去局部更新不同的页面内容,完成
2022-05-11 21:20:10 176
原创 vue-自定义指令
除了核心功能默认内置的指令 (v-model 和 v-show)等,Vue 也允许注册自定义指令 v-xxx1 、html+css+js的复用的主要形式是组件2 、你需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令目标: 获取标签, 扩展额外的功能<template> <div> <h2>自定义指令-获取焦点</h2> <input v-focus type="text" /> <h
2022-05-09 22:07:07 259
原创 Vue-插槽
Vue插槽是一种将内容从父组件注入子组件的绝佳方法。组件通过插槽传入自定义结构。用于实现组件的内容分发, 通过 slot 标签, 可以接收到写在组件标签内的内容。vue提供组件插槽能力, 允许开发者在封装组件时,把不确定的部分定义为插槽。1、匿名插槽(slot)在定义组件时,在template中用slot来占个坑代码演示://子组件<template> <div> <h2>有内容</h2> <
2022-05-09 22:00:39 278
原创 Vue-动态组件
1、component组件目标: 多个组件使用同一个挂载点,并可以动态切换,这就是动态组件<template> <div> <button @click="comName = 'UserName'">账号密码填写</button> <button @click="comName = 'UserInfo'">个人信息填写</button> <p>下面显示注册组件:</p>
2022-05-09 21:17:19 2873
原创 Vue-组件通讯
什么是组件化开发:组件是可复用的 Vue 实例, 封装标签, 样式和JS代码1、组件开发的步骤:第一步:引入组件(import 变量 from "组件路径";)第二步:注册组件 components: { Son: Son, //可以简写为Son, }第三步:使用组件,单双标签都可以<Son /><Son class="one"></Son>完整代码:<template> <di
2022-05-08 22:04:56 199
原创 Vue,一个强大的前端框架(基础知识和用法)
是什么:vue官网。vue是一个渐进式的javascript框架渐进式: 逐渐按需添加, 想用什么就用什么, 不必全都使用vue的特点:①渐进式 ②数据驱动视图 (响应式) ③组件系统1、创建项目1.1 创建命令命令:vue create vuecli-demovue和create是命令, vuecli-demo是文件夹名1.2 目录结构创建vue项目后会会生成一个目录结构,下面为结构说明:1.3 运行流程(运行基础)2、正式学习..
2022-05-04 11:44:10 1043
原创 webpack,一个优秀的打包的工具
1、什么是?webpack是一个静态模块打包器2、作用①有效处理模块化。默认情况下,浏览器并不支持模块化,而我们的前端项目又使用了模块化,有了webpack之后,就可以突破这个限制了。(翻译(降级,es6/7 ----> es5))②webpack可以把多个相互引用的.js文件打包成一个文件,且文件有加密,压缩的效果,上线更安全。3、使用准备工作:任意新建一个空文件夹,取名为webFile,进入到文件夹...
2022-05-03 19:40:32 1176 2
原创 使用promise技术优化异步代码
前提要点:1、要了解promise首先我们要弄清楚什么是异步?同步:就是一件事一件事的执行。只有前一个任务执行完毕,才能执行后一个任务。异步:是相对于同步而言的,就例如定时就是一个异步任务,当浏览器按顺序执行JavaScript的代码时,发现有个定时器,浏览器不会一直等,而是会直接跳过这个定时器去执行后面的代码,等代码都执行完毕后,再来执行定时器的代码!*详细介绍可以点击链接:什么叫异步_普通网友的博客-CSDN博客_异步2、什么情况下需要...
2022-05-01 23:54:23 597
原创 解决跨域问题
1、什么是跨域?是从一个域名去请求另外一个域名的资源2、为什么会出现跨域问题?(1)请求响应双方url不同源。双方url:发出请求所在的页面 与 所请求的资源的url同源是指:协议相同,域名相同,端口相同 都相同。以下就是不同源的:从http://127.0.0.1:1001/index.html 请求http://localh...
2022-04-30 00:22:53 1685
原创 express,一个基于 Node.js 平台,快速、开放、极简的 Web 开发框架
前提了解Express 是什么:是一个第三方模块,有丰富的 API 支持,强大而灵活的中间件特性什么是中间件:在数据交给服务器前,数据会在中间件里进行部分数据的分解,从而使得到达服务器的数据更好的进行处理。安装express expresss 是一个第三方模块(在npm上可以下载),在使用它之前要先去下载它,在下载包之前要先创建项目,并通过npm init 创建package.json文件。通过 npm i express 进行安装正式进入express1、e...
2022-04-29 23:56:56 1049
原创 用node.js搭建自己的服务器
前提要点:1、首先让我们了解一下什么是服务器和客户端吧!服务器是提供网络服务的机器,通过安装特殊的软件(或者是运行某段特殊的代码)来提供服务。客户端与服务器:提供服务的是服务器,享受服务的是客户端2、服务器的类型根据服务不同,服务器的类型也不同,例如web服务器提供图片浏览,新闻浏览....等服务的服务器。3、ip地址和域名ip地址:标识一个网络设备(计算机、手机、电视)在某一个具体的网络当中的地址。要访问某...
2022-04-28 20:48:32 8291 5
原创 切换npm的镜像源
先查看自己的镜像源:npm config get registry如果获得https://registry.npmjs.org则为官方镜像源,而默认的就是官方镜像源,由于官方的镜像服务器在国外,导致下载速度慢,现将镜像源切换到国内的,提高下载速度:npm config set registry https://registry.npm.taobao.org如果要切回官方镜像源,输入一下命令:npm config set registry https://registry.npm..
2022-04-28 19:50:43 2653
原创 require加载规则:
require 优先加载缓存中的模块。同一个模块第一次require之后,就会缓存一份,下一次require时就直接从缓存中去取。 如果是加载核心模块,直接从内存中加载,并缓存 加载核心模块的格式是 const xxx = require("模块名") 。不能写相对路径! 如果是相对路径,则根据路径加载自定义模块,并缓存 以require('./main')为例( 省略扩展名的情况) 先加载 main.js,如果没有再加载 main.json,如果没有再加载 main.node(c/c..
2022-04-27 23:01:58 501
原创 npm 常用命令
查看查看npm -v // 查看npm 版本where node // 查看node的安装目录where npm // 查看npm的安装目录npm root -g // 查看全局包的安装目录npm list -g --depth 0 // 查看全局安装过的包升级 npmnpm install npm --global // 简写成 -gnpm install npm -g初始化 package.jsonnpm ini..
2022-04-27 23:00:38 136
原创 npm了解与使用
npmnpm 全称 Node Package Manager(node 包管理器),它的诞生是为了解决 Node 中第三方包共享的问题。 npm 不需要单独安装。在安装Node的时候,会连带自动安装npm。 npm -v检查安装的情况。 官网当我们谈到npm时,我们在说两个东西:命令行工具。这个工具在安装node时,已经自动安装过了,不需要额外安装。 npm网站。这是一个第三方模块的"不花钱的模块超市",我们可以自由地下载,上传模块。不花钱的模块超市npm网站收集
2022-04-27 22:54:27 1840
原创 node.js 新手入门指南
是什么:是一个基于Chrome V8引擎的JavaScript环境学习方向:模块系统(核心模块、自定义模块、第三方模块)+ npmECMAScript+内置模块1、安装打开Node.js 中文网,选择下载选项,选择匹配你当前电脑的系统版本2、node初体验使用node跑JavaScript代码在当前文件加下面有一个node初体验.js文件,文件内容为:现在运用node+文件名.js命令运行该文件3、node.js运行环境...
2022-04-25 22:05:42 1437 1
空空如也
想要选择往计算机行业发展,想了解行业现状,有人可以分享一下吗?
2022-06-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人