css -- 瀑布流布局 效果:实现:<!DOCTYPE html><html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>瀑
el-table 分页情况下index累加展示序号 效果:实现:1: \src\utils\index.js 创建方法export function indexMethod (index, pageNum,pageSize) { return (index+1) + (pageNum-1) * pageSize}2: \dc\src\main.js 引入方法,挂载全局// 引入import {indexMethod} from '@/utils/index'// 全局方法挂载Vue.prototype.indexMethod
mockjs 用法 官网npm install mockjs --save-dev引入mock var Mock = require('mockjs')// 定义数据类型var data = Mock.mock({ // 20条数据 "data|20": [{ // 商品种类 "goodsClass": "女装", // 商品Id "goodsId|+1": 1, //商品名称 "goodsName": "@ctitle(10)", //商品地址
element-plus 分页器 pagination 显示英文问题 未处理效果:处理后效果:处理方法:打开 src\App.vue<template> <el-config-provider :locale="zhCn"> <router-view /> </el-config-provider></template><script setup lang="ts">import { ElConfigProvider } from 'element-plus'impo
Property ‘ ‘ does not exist on type ‘AxiosResponse<any, any>‘. vue的axios请求返回值调取时报下面这错误:Property ‘rows’ does not exist on type ‘AxiosResponse<any, any>’.解决方法是新增一个 axios.d.ts 文件,内容如下import * as axios from 'axios'declare module 'axios' { interface AxiosInstance { (config: AxiosRequestConfig): Promise&
css--文字渐变由上到下 效果:cssspan{ background: linear-gradient(180deg, #ffffff 10%, #75d6ff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
el-input -- 去除右侧上下箭头 <el-row> <el-col :span="24"> <el-form-item label="报价" prop="price"> <el-input type="number" v-model="form.price"&g...
FileSaver.js 客户端保存文件的解决方案 介绍:FileSaver.js是一个HTML5 saveAs()FileSaver实现,它是在客户端保存文件的解决方案,非常适合在客户端生成文件的web应用程序!效果:代码:<!DOCTYPE html><html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.
el-tree 懒加载load 手动触发load更新 代码:关键代码 // el-tree 懒加载load 手动触发load更新 handleNodeExpand (data) { let _node = this.$refs.tree.getNode(data); // 设置未进行懒加载状态 _node.loaded = false; // 重新展开节点就会间接重新触发load达到刷新效果 _node.expand(); }点击节点展开 // 节点单击事件
css--媒体查询 方式一:一种是直接在link中判断设备的尺寸,然后引用不同的css文件:意思是当屏幕的宽度 大于等于400px的时候,应用styleA.css <link rel="stylesheet" type="text/css" href="styleA.css" media="screen and (min-width: 400px)">在media属性里:screen 是媒体类型里的一种,CSS2.1定义了10种媒体类型and 被称为关键字,其他关键字还包括 not(排除某种设
vant - pc端适配(桌面端适配) 记录一下 需求:页面在pc端打开,使得有些组件不能够在pc端使用. 例如: DatetimePicker组件,在pc端无法进行上下拖动操作的:解决方案:官网推荐安装模块npm i @vant/touch-emulator -S在main.js 引入模块后自动生效// 引入模块后自动生效import '@vant/touch-emulator';...
正则 - 纳税人识别号 需求:对输入的税号进行校验,效果如下. 用正则去做校验效果:正则:/^(([0-9A-Za-z]{15})|([0-9A-Za-z]{18})|([0-9A-Za-z]{20}))$/
layui表格展示数据:返回的数据不符合规范,正确的成功状态码应为:“code“: 0 问题:解决方案:添加 parseData 回调函数将其解析成 table 组件所规定的数据格式官网描述主要代码: /** * table初始化 */ function tableRender(data) { //第一个实例 table.render({ elem: '#resultTable', height:
vscode -- 常用快捷键 并行编辑键盘快捷键:Ctrl+\集成终端键盘快捷键:按 Ctrl+'在编辑器之间切换键盘快捷键: Ctrl+1, Ctrl+2, Ctrl+3移动到资源管理器窗口键盘快捷键:Ctrl+Shift+E关闭当前打开的文件夹键盘快捷键:Ctrl+W列(框)选择您可以通过在拖动鼠标时按住 Shift+Alt(在 macOS 上按住 Shift+Option)来选择文本块。将在每条选定行的末尾添加一个单独的光标。快速滚动按 Alt 键可在编辑器和资源管理器中快速滚动。默认情况下,
layui-module (模块化) 文件结构代码test.html<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <link rel="stylesheet" type="text/c
vant-- van-form 使用 需求:输入框要求:1: 必填项展示2: 格式效验3:可以清除4:上传图片限制大小,类型手机号: 校验邮箱: 校验效果:代码 <van-form ref="form"> <van-field v-model="form.name" clearable name="姓名" label="姓名" placeholder="姓名" required :rules="rules.