- 博客(24)
- 收藏
- 关注
原创 bootstrap table单元格内容超出部分鼠标悬浮提示所有内容
bootstrap table单元格内容超出部分隐藏,鼠标悬浮的时候显示所有内容
2022-10-19 22:41:37 1614 1
原创 vue中上传图片基本操作
<el-upload></el-upload>组件,实现图片的上传 <el-upload name="file" :multiple="false" :action="upload.actionUrl" :file-list="fileList" :on-success="handleUploadSuccess" :on-chan
2022-05-15 16:24:52 597
原创 swiper 轮播图制作
swiper插件 经常制作轮播图(移动端|PC端也可以使用) 使用步骤: 第一步:引入相应的依赖包(swiper.js|swiper.css) 第二步:页面中的结构务必要有 第三步:初始化swiper实例,给轮播图添加动态效果Carousel文件中的index.vue// 引入Swiper包import Swiper from "swiper";main.js// 引入Swiper样式import ...
2022-05-12 16:06:28 614
原创 Mock数据
使用步骤:1.在项目当中src文件夹中创建mock文件夹2.第二步准备JSON数据(mock文件夹中创建相应的JSON文件) -------格式化一下,别留有空格(跑不起来)3.把mock数据需要的图片放置到public文件夹中【public文件夹在打包的时候,会把相应的资源原封不动打包到dist文件夹中】4.创建mockServe.js通过mockjs插件实现模拟数据5.mockServe.js文件在入口文件中引入(至少需要执行一次,才能模拟数据)以轮播图为例:banner.j
2022-05-12 15:48:27 325
原创 vuex状态管理库
vuex是什么?vuex是官方提供的一个插件,状态管理库,集中式管理项目中组件共用的数据。切记,并不是全部项目都需要vuex,如果项目很小,完全不需要vuex,如果项目很大,组件很多,数据很多,数据维护很费经,使用vuex// state;仓库存储数据的地方// mutations:修改state的唯一手段// actions:处理action,可以书写自己的业务逻辑,也可以处理异步// getters:理解为计算属性,用于简化仓库数据,让组件获取仓库的数据更加方便******.
2022-05-11 16:04:23 284
原创 API接口统一管理
1、在api文件夹中建立index.js文件引入axios二次封装的文件import requests from "./request";对外暴露一个函数,只要外部调用这个函数,就向服务器发起ajax请求,例如:export const reqCategoryList=()=>requests({url:'/product/getBaseCategoryListe',method:'get'});2、在入口文件中统一接收api文件夹里面全部请求函数,统一引入import
2022-05-11 15:43:05 686
原创 Axios的二次封装
为什么需要进行二次封装axios? 请求拦截器,响应拦截器,请求拦截器 :可以在发请求之前可以处理一些业务响应拦截器:当服务器数据返回以后,可以处理一些事情request.js //对于axios进行二次封装// 在当前模块中引入store import store from '@/store'import axios from 'axios'// 引入进度条import nprogress from 'nprogress';// 引入进度条样式impor...
2022-05-11 15:27:07 107
原创 路由传递参数
一、参数有几种写法:params:属于路径当中的一部分,需要注意,在配置路由的时候,需要占位query参数;不属于路径当中的一部分,类似于ajax中的queryString /home?k=v&kv=,不需要占位路由传递参数: 第一种:字符串形式 params参数(在路由中的search模块需要占位,传递的参数为keywords)query参数是k=v的形式 // this.$router.push("/search/"+this.keyword+...
2022-05-11 14:42:17 997
原创 Vue项目中实现用户登录、退出及token验证
1、第一次登录的时候,前端调后端的登陆接口,参数为用户名和密码,2、判断输入的用户名和密码是否与后端数据库中的信息匹配,验证成功,给前端返回一个token,输入错误信息,弹出提示框3、判断是否有token,有token的话,放在请求头中返回数据,进入到首页面,若没有,把异常现象打印出来,停留在登录页面...
2022-05-11 00:54:26 1101
原创 axios发请求
axios发get请求: 1.拼接字符串方式, 2.解析路径方法axios发post请求 1. 请求体方式 2.post还可以用get的以上两种方式发请求
2022-05-07 01:39:31 40
原创 vue跨域问题的一种解决方法 :No ‘Access-Control-Allow-Origin‘ header is present on the requested resource
在vscode中打开我们创建的项目,vue.config.js文件中添加以下代码进行配置,解决跨域问题方式一:开启单个代理服务器方式二:开启多个代理服务器(项目中常用) 注意:如果有些项目中不仅有mock数据还有请求接口返回的数据,在某些情况下,例如axios发post请求,前端向服务器发送成功了,状态码status为200,但是没有返回的数据,这种情况是因为,我们在解决跨域配置的时候,首先调用mock,已经消耗了入参(这里的消耗指的是:将流中的数据读取,导致向后端发请求的时候,请...
2022-05-07 01:17:29 2339
原创 el-table-column 传数组
项目开发中使用Element-UI表格组件,在el-table-column通过prop参数展示每列的数据(prop:对应列内容的字段名,也可以使用 property 属性),如下代码:data中初始化数据axios的get发请求,返回数据 在表格中传参 对于有的column列不适合通过具体的数据直接展示到页面,该column列中不要设置prop,而需要呈现的内容可以通过el-table-column的标签在内容区域呈现即可。Table-column Scoped Slot 自定义...
2022-05-07 00:44:39 2594
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人