D_evin_-CSDN博客

1、下载依赖（不带版本号会缺少文件）npm install [email protected] --save2、main.js 引入import VueAwesomeSwiper from 'vue-awesome-swiper'import 'vue-awesome-swiper/node_modules/swiper/dist/css/swiper.css'Vue.use(VueAwesomeSwiper)3、在单页面中使用<templ...

2022-02-11 13:24:48 878

原创 vue+element实现手机号验证码注册

很全的PC端手机端适配！一个项目多个域名我试了代理跨域本地运行可以打包上传不行，然后就用全地址，后端哪里要设置域名白名单！直接上图和完整代码！觉得可以就点个赞吧，谢谢！代码：<template> <div> <div class="register_box"> <div class="icon1" onClick="window.location.href='/'"&g...

2022-01-25 10:46:04 4608 2

原创 Vue+element 自定义Carousel 走马灯 PC端手机端适配

Vue+element 自定义Carousel 走马灯 PC端手机端适配

2022-01-19 14:09:02 1108

原创 vue+element 实现简单分页自定义内容

<template> <div> <div class="content"> <div class="item" v-for="(item,i) in allList.slice( (currentPage - 1) * pagesize, currentPage * pagesize )" :key="item.id" &gt...

2022-01-10 17:02:40 568

原创 jQuery、Vue和微信小程序数据绑定 ‘待办事项‘ 小练习

文章目录一、jQuery？需求代码实现二、Vue需求代码实现三、微信小程序需求代码实现一、jQuery？需求1.输入框中开始没有数据，确定按钮应该是disabled状态2.当输入框中输入内容时，需要判断实时切换输入框的disabled 状态。例如:有内容，则按钮可用，没有内容:按钮不可用3.当点击确定按钮之后，获取输入框的值，填入到列表的最下方。并且要清空输入框的值,确定按钮变为不可用4.在输入框中按回车，如果输入框有值，则填入到列表最下方，并且清空输入框，按钮不可用。如果输入框没有

2021-12-16 17:19:57 1101

原创 Vue 回到顶部按钮完整代码在最后

HTML代码<template> <div> <a href="#top" target="_self" id="top-btn"> <img src="/images/返回顶部.png" alt /> </a> </div></template>图标在阿里巴巴矢量图标库：https://www.iconfont.cn/home/index?spm=a313x.77810..

2021-12-03 14:59:15 857

原创 vue element组件表单姓名、手机号、邮箱正则验证

<template> <div> <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="你的姓名" prop="uname"> <el-input ...

2021-11-26 14:04:44 2959

原创 vue element组件实现表单、联动进度条（好用）

输入之后进度条会加进度，删除后进度条会减回去1.引入引入 Element在 main.js 中加入入以下内容：import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.use(ElementUI);2.在views文件夹里创建Wenjuan.vue文件,并在router文件夹的index.js里设置路由Wenjuan.vue里的内容：<template..

2021-11-25 14:11:35 1573 2

原创全站开发好用vue库、API、框架等好用网站合集

1.Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库https://element.eleme.io/#/zh-CN/component/menu2.Vant 有赞前端团队开源的基于vue的移动端组件库https://vant-contrib.gitee.io/vant/#/zh-CN/swipe3.Mint UI 基于vue的移动端框架http://mint-ui.github.io/docs/#/zh-cn24.Bootstrap 最受欢迎

2021-11-15 16:34:22 2753 1

原创程序员所需要的 “正则表达式”（大全）

一、校验数字的表达式1.数字：^[0-9]*$2.n位的数字：^\d{n}$3.至少n位的数字：^\d{n,}$4.m-n位的数字：^\d{m,n}$5.零和非零开头的数字：^(0|[1-9][0-9]*)$6.非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$7.带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$8.正数、负数、和小数：^(\-|\+)?\d+(\.\d+)?$9.有两位小...

2021-08-26 21:47:53 228

原创 Vue 电子签名

vue实现电子签名

2023-02-10 09:54:39 263

原创 Vue面试题2021最新热门面试题（浅答）

vue双向绑定原理：vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的Object.defineProperty()来实现数据劫持，对应的两个描述属性get和set例子：1. 将实例中的data中的内容绑定到输入框以及文本节点当中2. 当输入框改变时，vm实例中的data的内容也跟着改变3. data中的内容发生变化的时候，输入框的内容以及文本节点的内容也发生变化v-show和v-if区别： v-if是通过控制dom节点的存在与否来控制元素的显隐；v-..

2021-12-14 09:07:15 301

原创数组冒泡排序、Set去重、reduce去重,正则表达式千分位分隔符

冒泡排序1.比较相邻的两个元素，如果前一个比后一个大，则交换位置。2.第一轮的时候最后一个元素应该是最大的一个。3.按照步骤一的方法进行相邻两个元素的比较，这个时候由于最后一个元素已经是最大的了，所以最后一个元素不用比较。var Arr=[12,3,4,52,56,32,23]function bubbleSort(arr) { for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr.l...

2021-12-06 09:28:43 169

原创 vue 跨域请求数据，点击列表转详情页

以腾讯校招公告接口为例：https://join.qq.com/api/v1/noticeDynamic/getNoticeDynamicList在view文件夹里分别创建列表页Lb.vue和内容页Nr.vue,并在router路由文件index.js里引入没设置跨域之前访问不到数据，控制台以Access to XMLHttpRequest开头的报错，这就是跨域.解决：src文件夹同级目录创建vue.config.jsvue.config.js内容：module.exports =.

2021-12-02 11:55:14 1428

原创 html前端命名规范

html前端命名规范、css 命名规范、CSS 通用命名、项目中文件命名、html文件的命名、图片的命名规则、文件夹存放规范、css 书写规范性能优化方案、CSS优化

2021-11-25 20:56:24 1382

原创 vue里的axios获取本地的json数据

1、新建一个vue项目在终端安装axios命令npm install --save axios vue-axios2、在main.js里导入下面的代码import axios from 'axios'import VueAxios from 'vue-axios'Vue.use(VueAxios,axios)3、创建本地的json数据（json文件一定要创建在public文件夹中）4、在需要数据的页面引入axios，异步加载数据...

2021-11-15 15:29:07 2832

原创 Bootstrap学习2：bootstrap中的布局

Bootstrap中的布局四、栅格布局- 栅格系统是用于页面布局，属于Bootstrap的核心- 可以在不同终端显示不同效果（响应式）- 栅格，具有行row、列col的概念，网格列是通过跨越指定的 12 个列来创建。1.栅格布局的列- 一行平均分为12个列- `.col-1~12`代表列占有行的十二分之几份2.栅格布局的响应式- `.col-sm-*` 小屏幕- `.col-md-*` 中屏幕- `.col-lg-*` 大屏幕- .

2021-09-18 16:16:44 1809

原创 Bootstrap学习1：bootstrap4.0基础

Bootstrap4.0基础一、Bootstrap的简介和作用1.Bootstrap的简介- Bootstrap是由twitter公司设计师基于html，css，js开发的简洁、开源、强大、优雅的UI框架。- UI框架就是能够快速构建html架构的框架。- 内置了大量的css类，供元素使用。- Bootstrap由一个css库和一个js库组成，因为在整个ui框架中还会有许多动态需效果需要js来完成，因此，Bootstrap在动态部分是依赖jquery一个js类库完成的。`Bootst

2021-09-18 16:12:21 709

原创 css学习12：过渡、变化、动画、响应式布局

元素的动效二十二、过渡transition 在英文中是过渡的意思，过渡可以为一个元素在不同状态之间切换不同的过渡效果。它由四个部分构成，分别是：过渡属性的名称，过渡需要的时间，过渡的方式和过渡的延迟时间。1.过渡属性的名称- `transition-property` 过渡样式过渡一定是有变化都，在 css 中变化都是样式，比如我们需要过渡一个颜色，那么你要过渡的属性名称就是`background-color`- 当过渡多个样式的时候可以写 all2.过渡需要的时间..

2021-09-16 19:25:22 1014

原创 css学习11：弹性布局

弹性布局二十一、弹性布局弹性布局是 css3 主推的一个布局，传统布局是基于文档流和盒子模型的，主要以浮动布局，定位布局等。给父元素加display：flex；使子元素横向排列，不用每个子元素浮动了父元素不需要清除浮动了，高度依然被子元素撑开1.弹性布局的基本概念(1)容器和项目使用 flex 布局的元素（父元素），称为"容器"它的所有“子元素”自动成为容器成员，称为 "项目"它们各自有控制布局的属性，必须是容器包裹着项目(2)主轴主轴...

2021-09-15 19:07:40 319

原创 css学习10：渐变和高级选择器

渐变和高级选择器十九、渐变1. 线性渐变(1) 颜色和角度- `background-image: linear-gradient(color1,color2,……);`渐变最少两个颜色，才能体现出颜色的变化- `linear-gradient()`渐变颜色的参数用逗号分开，可以写多种颜色表达方式- 渐变的方向，按照参数顺序依次向下，可以在颜色前加入角度或关键字控制渐变方向- `90deg` 角度- to 终点关键词，就是终点在哪个位置，top，left，right...

2021-09-14 21:07:57 303

原创 css学习9：元素定位

定位的元素十八、定位1.position 属性- `position`属性是定位属性，用于指定一个元素在文档中的定位方式。- top，right，bottom 和 left 属性值则决定了该元素的距离四边的位置，可以为负值。- 开发中多用绝对长度单位 px 进行调整，如果在移动端中，可以使用 rem、vw 等单位进行调整。- 常用取值：- `relative` 相对定位- `absolute` 绝对定位- `fixed` 固定定位2.相对定位- 相...

2021-09-13 20:58:02 186

原创 css学习8：浮动和流体布局

浮动和流体布局十七、浮动和文档流1. 默认文档流- 流就是文档布局的自身特性,而定位机制可能就会打破原有流的特性- 默认文档流,画格子,内联和块级- 内联元素，从左向右排列- 块级元素，从上向下排列2. 脱离文档流文档一旦脱离文档流，不受文档流的布局约束了，在算其父元素的高度时，就不包括其自身了。以下属会导致元素脱离文档流：- float 浮动- position 定位(绝对定位、固定定位)2. 浮动- 子...

2021-09-13 20:41:48 317

转载 css学习7：盒子模型

元素是个盒子十五、溢出1.溢出属性- `overflow: hidden;`溢出隐藏- `overflow: scroll;`x 轴 y 轴都出现拖动条，子元素不超出也会有滚动条的那条轨道。- `overflow: auto;`只有溢出的方向出现拖动条- `overflow: visible;`溢出默认展示- 单独设定 x 轴或者 y 轴的溢出- overflow-x: auto;- overflow-y: hidden;- 如果 overflow-x、o...

2021-09-11 18:46:02 193

原创 css学习6：背景

背景十四、背景1. 背景颜色`background-color: 颜色色值;`2. 背景图片（1）背景图- `background-image: url(路径);`- 路径可以是绝对路径或者相对路径,注意外部 css 的路径- 背景图必须要求元素具有宽度和高度 .bg { width: 100%; height: 500px; background-image: url(./img/xz-login/regist.png); }

2021-09-10 20:47:24 153

原创 css学习5：元素的修饰

元素的修饰十、圆角1.元素的四个角- `border-top-left-radius`左上角- `border-top-right-radius`右上角- `border-bottom-left-radius`左下角- `border-bottom-right-radius`右下角2.圆角的取值-水平边和垂直边设置相同- 1 个值代表四个角- 2 个值代表左上和右下，右上和左下- 3 个值代表左上，右上和左下，右下- 4 个值代表左上..

2021-09-10 20:21:15 166 1

原创 css学习4：字体和文本

字体和文本八、文本格式化1. 字体属性（1）字体大小字体大小可以使用不同的单位，如 px、pt、em、rem、vw 等等，不允许负值像素，尽量不出现小数。pt 是 ui 经常会用的单位，dpi：直接来说就是一英寸多少个像素点，可以理解为像素密度，pt = px \* dpi / 72 ，遇到 pt 的设计图怎么处理，pc 端页面使用 px，移动端可以使用 em，rem 以及 vw- `font-size: 30px;`字体号属性- 取值，如 px、pt、em、rem、vw 等等，不

2021-09-10 20:12:40 130

原创 css学习3:元素基础样式

元素基础样式三、尺寸和单位- 定义宽度`width`和高度`height`可以使用长度单位：px，pt，rem，em，%等等- 一般 pc 端网页使用 px 或 pt- 移动端使用%，em，rem，vw，vh 等响应式单位- 最大宽度最小宽度，最大高度和最大宽度（在响应式部分进行讲解）- `max-width`最大宽度，`max-height`最大高度- `min-width`最小宽度，`min-height`最小高度- 不允许出现负值，最小不满足时出现横向或竖向...

2021-09-10 20:01:52 123

原创 css学习2：css选择器

css选择器二、选择器1.基础选择器【注意】相同的选择器不同的属性声明，不会被覆盖而是共同应用。（1）通用选择器- `*`号，选择 html 文件内所有的元素 `* {样式声明}`- 最常用的用法是`*{margin:0;padding:0}` 清除浏览器的内外边距。但它的缺陷是性能太低，所有的元素不论是否有内外边距都会渲染，但可以做练习时使用。（2）元素选择器（标签选择器）- 通过标签的名字来选择 html 元素，权重值为 1，比如：`div {样式声明}`- 弊.

2021-09-10 19:51:45 516

原创 css学习1：初识css

初识css一、css 的概述1.早期的 web 网页在 20 世纪 90 年代的，html 迅猛发展，不同的浏览器根据自身的结构支持不同的样式。到现在位置，不同的浏览器 html 标签在不同的浏览器中展现的基本样式也不尽相同。随着功能增加，html 就变得越来越混乱。只依靠标签的堆叠，东西越多页面展示越乱。这时候用于装饰网页样式的 css 就诞生了。1997 年，w3c 颁布了 css1.0 版本，随即微软和网景公司的浏览器均能支持 CSS1.0。2.c..

2021-09-10 19:39:36 170

原创 JSON 和HTTP&AJAX前后台交互案例图解

案例在文章最后JSON1. JSON 简述JSON是一种轻量级的数据交换格式。采用完全独立于编程语言的文本格式来存储和表示数据。2. JSON 语法规则JSON 是一个序列化的对象或数组。属性名（key）用双引号包裹，值可以是对象、数组、数字、字符串或者三个字面值(false、null、true)中的一个。值中的字面值中的英文必须使用小写。（1）对象结构{"key1": "value1","key2": "value2"}（2）数组结构[{"key1":

2021-09-03 22:07:18 592 2

我的博客静态网站+js轮播图

vue实现项目仿哔哩哔哩

仿小米商城微信小程序项目

“本地资源”微信小程序项目

空空如也