- 博客(35)
- 问答 (4)
- 收藏
- 关注
RSS订阅原创 响应式布局(0523周一)
介绍：同一页面在不同屏幕有不同的布局，不同的屏幕尺寸有不同的样式核心：同一套代码结构有多套样式（媒体查询）方法：方法一、媒体查询+rem布局+百分比使用步骤：一、在head区必须加入这句<!-- 移动端开发，媒体查询必备 --> <meta name="viewport" content="width=device-width, initial-scale=1.0" />二、rem布局介绍：相对于根元素字体大小而言场景：项目中
2022-05-23 22:18:09
85
原创 2022.05.05周五
一、jquery中的insertAfter的用法介绍：在指定元素后面添加内容语法：$(content).insertAfter(selector)说明：参数 说明 content 插入的内容 selector 哪个元素后插入内容 示例：1、需求：在下图中添加一个电话号码这个时候就可以用到insertAfter了代码： <div id="top"> <ul class=".
2022-05-05 23:28:41
182
原创 js数组2021.12.31
数组的splice方法介绍：删除数组元素语法：数组.splice(删除的元素，个数)示例： var arr = ['karry', 'roy', 'jackson', 'cx', 'wyb', 'bjt']; arr.splice('love', 1) console.log(arr); // splice的结果["karry", "roy", "jackson", "cx", "wyb", "bjt", "wje", "lhr"]数组的indexOf方法介绍：
2022-01-06 21:46:17
344
原创 修改element ui的el-form表单中的label样式
需求：修改el-form表单中的label样式实现：一、新增一组style标签或者去掉原来style标签里的scoped<style lang="less" scoped></style>并去掉style里的scoped二、给el-form-item添加class方便准确获取到元素，不至于修改所有的label <el-form-item label="用户名" class="item"> <el-input v-mo
2022-01-06 21:00:48
12329
1
原创 localStorage和sessionStorage 2021.12.30
一、localStorage和sessionStorage的异同点（Html5新特性）相同点：1.都保存在客户端。2.只能存储字符串类型。3.以键值对的形式保存数据。不同点：localStorage：本地存储，永久性存储，除非用户自己清除。sessionStorage：会话存储，临时性存储，生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，那么存储的数据也会被清空。语法：setItem(key, value) —— 保存数据，以键值对的方式存储信息get.
2021-12-30 22:27:31
490
原创 小程序概况
一、微信小程序原理微信小程序采用WXML 、WXSS、JS三种技术进行开发，从技术讲和现有的前端开发差不多，但又有所不同。小程序分为两个部分webview和appService。其中webview用来展示UI，appService用来处理业务逻辑、数据及接口调用。它们在两个进程中运行，通过系统层JSBridge实现通信，实现UI的渲染、事件的处理。WXML：基于XML语法开发的，因此开发时只能使用微信开发者文档提供的现有标签。WXSS：具有CSS的大部分特性，同时也引入了一些东西。..
2021-12-28 21:31:17
936
原创 CSS科技感四角边框
需求：在做大屏数据时经常会看到那些四角边框效果图：分析：1.先画出整个大边框2.然后用::before和::after分别画出两对边框覆盖大边框的上下左右四边，只留下四个角实现（示例代码）：<template> <div class="box"> <div class="border_item"></div> </div></template><script>expor.
2021-12-15 22:33:14
4038
1
原创 Html、Css常见面试题
DOCTYPE有什么作用告诉浏览器使用哪个版本的Html规范渲染文档标准模式和混杂模式的区别标准模式：以浏览器支持最高标准运行混杂模式：向后兼容DOCTYPE不存在或形式不正确会导致Html文档以混杂模式显示浏览器内核介绍：浏览器所采用的渲染引擎 ，渲染引擎主要负责获取页面内容然后进行解析从而渲染页面。渲染引擎决定浏览器如何显示页面，不同浏览器有不同的内核，它们对网页的语法解释也不同，所以显示网页的内容以及页面格式信息也就不同，因此同一网页在不同的内核的浏览器里的...
2021-12-13 18:16:20
388
原创 修改第三方组件库样式的方法
需求：在日常开发中，可能会需要改动element ui、vant等第三方组件库的样式，可以采取以下方式方式一：::v-deep方式二：/deep/
2021-11-24 17:11:23
787
原创 vue中如何安装less库
介绍：less是css预处理器，对原先css进行了扩展和补充，可以语法嵌套使用：1、安装npm install less less-loader --save-dev2、配置，打开 build目录，修改 webpack.base.conf.js 中的相关配置在 module.exports 中找到 module 中的rules数组添加如下代码： module: { rules: [ // less配置 { test: /\...
2021-11-11 10:04:43
690
原创 Vue中根据输入的身份证号识别年龄、性别
需求：根据用户输入的身份证号识别出年龄和性别，回显到相应的输入框中分析：定义身份证号的正则表达式，利用字符串的方法截取出相关字符进行判断示例：<template><div class="box"><!-- 根据身份证号生成性别，年龄 --> <div class="form_txt">根据身份证号生成性别、年龄</div> <el-form :model="form" label-width="80px"&.
2021-11-10 18:39:27
3193
1
原创 el-dialog对话框重新打开后数据遗留问题
场景：重新打开el-dialog对话框时，里面的表单数据遗留并没有清空解决：监听el-dialog对话框的关闭事件，给el-dialog绑定@closed事件，再调用el-form表单的重置方法示例：<el-dialog @closed="resetForm"> <el-form ref="formRef"> </el-form></el-dialog><script>export default {
2021-11-10 14:35:36
2073
2
原创 el-table表格el-table-column根据不同的值，动态显示不同的颜色
需求：表格列有多个状态，不同的状态展示不同的颜色，这个时候用三目运算符不太方便，可以用computed计算属性示例： <template></template>模本中<el-table-column prop="totalGrade" label="自评得分" align="center"> <template slot-scope="scope"> <span :style="classObje(scope.ro
2021-11-08 18:10:36
5704
2
原创 vue-----vue-18n多语言处理，实现国际化
需求：后台管理系统中要求页面国际化，页面语言能够进行切换，满足不同地区用户需求。可以借助vue-i18n插件来实现这个需求vue-i18n国际化插件：实现语言切换使用：一、安装依赖npm install vue-i18n二、main.js文件中导入、配置（配置也可写在一个单独的i18n.js文件中）import Vue from "vue";import App from "./App";import router from "./router";import VueI
2021-10-19 23:11:54
1172
原创 vue点击复制链接功能
需求：点击复制链接，粘贴到地址栏中跳转到相应页面原理：创建input标签，将链接值赋值给input标签，调用浏览器复制方法示例代码：<template> <div class="box"> <div class="title">复制链接并在地址栏输入可跳转</div> <p v-text="url"></p> <el-button v-if="url" @click="Copy...
2021-10-14 22:51:33
6312
3
原创 vue项目中借助vue-print-nb插件实现打印
需求：打印页面部分内容插件原理：创建iframe，获取要打印的内容添加到iframe中，调用print()方法打印使用：一、安装插件npm install vue-print-nb --save二、页面上导入并注册// 导入插件import Print from "vue-print-nb";export default { // 注册指令 directives: { Print, },}三、提供容器并添加id四、给按钮添加v-print指令，并
2021-10-12 23:12:07
468
原创 vue项目中生成二维码并且下载该二维码
需求：根据某字段生成二维码并且可以下载该二维码分析：通过qrcodejs2插件生成二维码qrcodejs2插件的·使用一、安装npm install qrcodejs2 --save二、页面上导入import QRCode from ‘qrcodejs2’三、提供容器，并给容器添加ref属性四、调用实例方法具体代码如下：<template> <div class="box"> <div class="title">
2021-10-07 22:11:41
1039
原创 Js获取url地址栏的某个参数并将其传给后端
需求：登录注册页面可能需要后期url地址栏的某个参数并且将它作为参数传给后端实列代码： function getUrlParam(name) { // 创建正则对象 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); // window.location 获取当前地址栏 var r = window.location.search.substr(...
2021-08-24 23:07:37
508
原创 select下拉框动态获取数据
需求：select下拉框中的数据是从后台接口中获取的，而不是自己写的假数据步骤：（这里是用jquery及ajax发送请求）一、页面上导入jquery在线资源二、代码实列如下（仅供参考） <select name="" id="getCurrenty"> <!-- <option id="optionId" value="">文本</option> --> </select><script>.
2021-08-24 22:55:15
1642
原创 vue项目中如何将数据导出到excel中
需求：在后台管理项目中，可能会遇到这样一个需求，把查询得到的数据导出到excel表格中，并且可以下载。此时可以借助js-export-excel来实现，到达我们想要的效果使用方法：一、安装依赖npm install js-export-exceloryarn add js-export-excel二、导入js-export-excel（在你需要导出的数据页面）import ExportJsonExcel from "js-export-excel";三、导出方法实现
2021-07-28 22:42:51
4771
8
原创 元素水平垂直居中的方法
方法一：flex布局（前提是要有两个盒子，父盒子设置display:flex,justify-content:center,align-items:center即可）方法二：定位+margin前提：知道盒子宽高思路：使用绝对定位，left和top设置为百分之五十，其实这个时候盒子并没有真正的居中，此时需要用margin-top和margin-left让他们的值等于盒子宽高的负一半例子：使用了margin-top和,argin-left后方法三：定位+平移思路：
2021-06-27 14:42:18
66
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人