![](https://img-blog.csdnimg.cn/901be6ff5b5444798d48bd1b8c922f08.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端日志
文章平均质量分 51
前端
兀坐晴窗独饮茶
我的个人博客 http://knightzz.cn/
展开
-
Element UI 系列 - 表单标签和输入框对齐以及修改输入框长度
前言elementui 文档中如何使表单的标签和输入框分别对齐类似于这样的效果, 虽然 Elementui官方文档写的有, 但是因为我不经常写前端, 每次都会忘记, 这里记录下官方文档https://element.eleme.cn/#/zh-CN/component/form如上图, 主要是通过修改 label-postion 对齐, 另外 label-width 是修改左侧标签的宽度, 如果宽度过小的话会导致标签编程两行输入框长度修改输入框长度主要使用的是 ::v-deep 这个指原创 2022-03-28 15:24:19 · 18068 阅读 · 0 评论 -
从零开始学习Vue - ElementUI自定义文件上传请求
1. 参考文档element-ui上传组件,通过自定义请求上传文件2. 自定义上传步骤自定义上传思路很简单, 我们自己封装文件对象以及需要携带的参数2.1 封装api我们自己封装请求的api, 不使用 elementui 自带的 actionimport api from '@/utils/api'export function excelUpload(formData) { return api({ url: 'excel/upload', method:原创 2022-02-17 13:23:44 · 1049 阅读 · 0 评论 -
Vue Bug 记录日志 - 上传组件 before-upload返回false自动调用before-remove on-remove钩子问题解决方法
1. 介绍说一个不算bug的bug, 就是我使用 elementui 的上传组件上传文件的时候,当 before-upload 返回false时 ,会自动调用 before-remove on-remove钩子, 官方文档似乎并没有写, 还是说我没找到, 反正我是没在官方文档中找到, 很坑爹2.解决办法解决办法很简单, 就是在 before-remove on-remove 方法里判断下文件上传的状态文件状态有三种 : 未上传的是 ready, 上传成功是 success, 失败时 fail原创 2022-02-14 18:08:59 · 870 阅读 · 0 评论 -
从零开始学习echarts - vue项目中使用echarts、ehcart地图绘制
1. 基础入门1.1. Vue项目引入Echarts1.1.1 安装 mockjsnpm install mockjs1.1.2 安装 echartsnpm install echarts --save1.1.3 Vue引入echarts在 src 目录下创建 plugins 目录, 然后创建 echarts-plugin.js 文件// 引入 echarts 核心模块,核心模块提供了 echarts 使用必须要的接口。import * as echarts from 'echar原创 2022-02-10 14:24:49 · 1631 阅读 · 0 评论 -
从零开始学习Vue - json-server 入门基础
1. json-server 入门基础1.1 安装 json-server参考文档 :json-server 详解json-server官方文档执行 npm install -g json-server 安装 json-server注意: json-server 是严格遵守 restful 规范的1.2 使用 json-server创建 db.json 文件{ "user": [ { "id": 1, "title": "json-serv原创 2022-02-06 10:40:26 · 849 阅读 · 0 评论 -
从零开始开发权限管理系统 - 基于vue-admin-template搭建基础框架
1. 项目准备1.1 项目介绍本项目是基于vue-admin-template开发的权限管理脚手架项目 github地址 : rights-manager-front1.2 模板下载下载 vue-admin-templategit clone https://github.com/PanJiaChen/vue-admin-template.git下载完成以后改成自己项目的名字在项目目录下执行npm install1.3 删除多余代码1.3.1 删除多余的组件删除原创 2022-01-29 22:46:07 · 1969 阅读 · 0 评论 -
从零开始学习Vue - vue项目命名规范
1. 命名规范Component所有的Component文件都是以大写开头 (PascalCase),这也是官方所 推荐的。但除了 index.vue。例子:@/src/components/BackToTop/index.vue@/src/components/Charts/Line.vue@/src/views/example/components/Button.vueJS 文件所有的.js文件都遵循横线连接 (kebab-case)。例子:@/src/utils/open-原创 2022-01-28 22:00:02 · 1557 阅读 · 0 评论 -
修改ElementUI组件样式
1. 使用方法以 el-input 为例 找到实际的组件内置样式的代码<div class="chat-sent"> <el-input></el-input> <div> <el-button type="primary" size="mini">发送</el-button> </div> </div>这里注意原创 2021-08-30 22:02:57 · 1737 阅读 · 0 评论 -
uni-app |onLoad方法中调用其他方法或者属性无效
问题在 onload 方法中调用其他的方法或者属性都会显示这个属性或者方法未定义!!我依稀记得我以前用就可以, 然后查看了以前的代码可以正常使用的 onLoad(option) { this.getPageInfo(option); },无法正常使用的写法! onLoad: (option) => { this.getPageInfo(option); }原因未知 !...原创 2021-04-29 12:02:01 · 2518 阅读 · 3 评论 -
Vue | VueCli4 打包后 打开项目空白的问题
问题描述使用Vue 编写项目后, 打包生成 dist 文件夹 ,然后打开文件夹中的 index.html 文件 页面空白vue 版本 : 2.xvue cli版本 : 4.x (不同版本会影响配置文件的位置)解决方法vue cli4 版本的 配置文件是 vue.config.js , 添加下面红框的内容即可, 将路径设置为相对路径然后 找到 路由配置 index.js 文件 , 如果 mode 设置的是 history 就注释掉,重新打包以后问题就解决了...原创 2021-04-27 19:05:21 · 1370 阅读 · 1 评论 -
ElementUI | 实现级联选择器实现省市区街道四级联动
实现效果实现步骤1. 下载数据城市数据-github主页2. 导入数据新建一个文件夹 存放json数据 , 这里我把文件名字修改成了 city.json , 原本的是 pcas-code.json然后新建一个 js 文件读取数据并导出为 对象, 代码比较简单, 我就不放在下面了 , 注意路径!3. 在页面中使用先在需要的页面中导入然后赋值给 相应的属性 作为级联选择器的数据源在 级联选择器上配置 相应的数据需要根据配置来制定相应的 value 和 label注意事项原创 2021-04-19 16:54:05 · 4924 阅读 · 3 评论 -
Mock | MockJS 的安装以及基本语法
MockJS 的入门以及安装1. 安装 NodeJS// 创建 Mock 目录,先安装 node 下的 mock.js; npm install mockjs 2. 运行官网示例代码创建一个 js 文件,键入官网示例代码: //引入 mock.js,相当于 src=mock.jsconst Mock = require('mockjs');const data = Mock.mock({ // 属性 list 的值是一个数组,其中含有 1 到 10 个元素 '原创 2021-03-27 21:36:52 · 1854 阅读 · 0 评论