- 博客(31)
- 收藏
- 关注
RSS订阅原创 【vue】-Element-UI之Cascader 级联选择器动态获取数据渲染
html <el-form-item label="活动分类"> <el-cascader clearable placeholder="请选择活动分类" v-model="classify_value" :key="refreshClassify" :props="classifyProps" @change="handleChange" ></el-cascader> </el-form-item>data：data() {
2021-07-02 16:37:48
2616
2
原创 uniapp微信小程序实现地图导航
利用点击事件 调用handleMapLocation()这个方法时获取了自己的定位，考虑到用户拒绝获取自己的定位所以当用户再次点击后会唤起设置让用户打开定位 handleMapLocation() { console.log('进入导航') // 经纬度暂时写死，后面介入数据 let latitude = Number(30.xxxx); let longitude = Number(114.xxxx); let address='武汉xxx' // .
2021-06-07 19:28:29
5358
5
原创 vue移动端中点击动态渲染数据 实现复制(避坑clipboard.js）
之前做过pc端的复制功能，按照之前写pc端的思路写移动端的复制功能 发现没生效，没有复制成功，一把辛酸泪，亲测避坑！首先还是使用clipboard.js官网链接：clipboard.jsnpm install clipboard --save在所需要的页面引入import Clipboard from "clipboard";我的html结构 <div class="file-list" v-for="(item, index) in lists" :key="ind
2021-05-16 23:56:20
436
原创 git提交代码报 vue-cli-service lint found some errors. Please fix them and try committing again
原因：问过度娘在提交代码的时候，它会在提交代码前运行做代码风格检查，如果代码不符合相应规则，则报错。解决：直接把pre-commit文件删除，进入项目.git文件夹-hooks-删除 。如何你的项目文件夹下没有找到.git文件夹，检查一下看看是不是隐藏你的文件夹了。将 pre-commit文件删除了。再次提交代码就ok了。下面如图就是在隐藏了.git文件夹，如何在终端操作删除隐藏 pre-commit的文件，步骤祥尽...
2021-04-25 23:42:58
2423
原创 git工作流 自用小总结
比如，目前项目远端有master分支、develop分支，协同在develop分支上开发，迭代完一个版本，再推上master分支，这样的一个概况；首先，把项目拉取到本地develop上面，新建自己的开发分支：dev_lx，并切换到自己的分支，开始愉快的敲代码…一顿猛如虎的操作完，在自己dev_lx分支上提交代码，日志commit一下切换到本地的develop分支，拉取远端的develop上的代码（可能其他小伙伴提交最新代码，需要拉取）拉取完毕后，再切换检出到自己的dev_lx分支，合并本地的de
2021-04-24 00:53:40
93
原创 nrm的安装、安装报错及nrm的使用
nrm是什么?nrm 是一个 npm 源管理器，允许你快速地在 npm源间切换。npm默认情况下是使用npm官方源（使用npm config ls命令可以查看），在国内用这个源肯定是不靠谱的，一般我们都会用淘宝npm源：https://registry.npm.taobao.org/修改源的方式也很简单，在终端输入：npm set registry https://registry.npm.taobao.org/进行全局安装nrmnpm install -g nrm有的会遇到这.
2021-04-22 22:30:54
1988
原创 vue element的日期选择器 ，选择日期时间范围的限制
最近在做活动配置，那么就会需要配置活动的开始时间和活动的结束时间，对于活动开始时间选择范围是不能今天之前时间的，活动的结束时间也是，是不能选择今天之前的时间和活动开始之前时间的，有了明确的目的，现在就来解决它！根据element官网提供的属性,来实现它html部分 <el-form-item label="活动时间" prop="startTime" :rules="[ { required: true,
2021-04-16 10:13:02
4535
原创 js 正则表达式验证数字(允许小数点),手机号码
var reg1 = /^[+-]?(0|([1-9]\d*))(\.\d+)?$/; //不限制小数位数 var reg2 = /^[+-]?((\d*(\.\d{1,})$)|(\d+$))/; //可限制小数位数 {1,} 小数时，必须1位以上小数 var reg3 = /^[+-]?((\d*(\.\d{1,})$)|(\d{1,3}$))/; //可限制整数位数 {1,3} 整数时，1到3位整数...
2021-04-13 18:20:03
441
原创 使用git 报错:The project you were looking for could not be found及解决方式
使用git clone 项目，出现这个问题：The project you were looking for could not be found解决方案一：git clonehttp://@git.coding.net/name/p… ---- 失败添加远程地址的时候带上用户名及密码即可解决，格式如下：git clonehttp://yourname:password@git.coding.net/name/project.git ---- 成功解决方案二：在自己的项目路径
2021-04-09 11:36:31
20952
5
原创 vue 生成二维码(中间logo),下载二维码,复制链接（vue + vue-qr+clipboard）
1.导入二维码依赖npm install vue-qr --savehttps://www.npmjs.com/package/vue-qr2.导入复制依赖npm install clipboard --savehttps://clipboardjs.com/3.代码：<template> <div class="shareDrawer"> <drawer :display.sync="singleDialog" :width="'25%'"&
2021-04-07 15:59:55
386
1
原创 js 两个数组比较，找出第一个数组中不存在于第二个数组中的值
let arrA = [1,2,3]let arrB = [3,4,5,6]let c = []arrA.forEach(item => { if(arrA.includes(item)&&!arrB.includes(item)) { c.push(item) }})console.log(c)//[1,2]
2021-04-06 19:13:45
3182
原创 vue element el-select选择器实现下拉加载数据,支持搜索功能
效果图===>代码===><el-form ref="form" :inline="true" :model="form" size="mini"> <el-form-item label="客户标签" > <el-select v-model="form.OUserId" v-el-select-loadmore="loadmore" plac
2021-03-17 20:25:52
907
原创 vue element-ui table单选
element-ui中只给了多选行，没有单选，自行实现效果==> <el-table ref="multipleTable" :header-cell-style="{ background: '#F4F5F9', color: '#282D3B', borderRadius: '2px' }" :data="ta
2021-03-16 21:27:07
120
原创 vue 点击编辑按钮 后 页面变成input输入框
<template> <li v-if=‘flag‘><span @click=‘edit()‘>点击一下</span></li> <input type="text" v-else @change=‘input()‘></template>export default{ data(){ flag:true }, methods:{ edit(){
2021-03-04 17:27:15
4309
2
原创 Vue element-ui - 登录的背后逻辑
登录业务流程：在登录页面输入用户名和密码，调用后台接口进行验证，通过验证之后，根据后台响应的状态跳转到项目主页登录业务的相关技术点：1.http是无状态的2.通过cookie在客户端记录状态，通过session在服务端记录状态3.通过token方式维持状态token原理：用户在客户端登录页面输入用户名和密码进行登录，服务器验证通过之后生成该用户的token并返回，客户端收到服务器返回的token将它存储起来，后续客户端的所有请求都携带该token发送请求，服务器验证token是否通过。登录的
2021-01-07 00:28:21
383
2
原创 Vue 项目中导入插件后 报 Cannot find module ‘babel-preset-es2015‘ 的错误
npm装好插件后 跑项目报错 Cannot find module 'babel-preset-es2015'这个错误的意思就是：不能从你的项目依赖中发现 babel-preset-es2015’的错误。因为之前我是按照 element-ui 官网的步骤按需加载组件，改过.babelrc文件以下是解决办法：1.首先，安装 babel-preset-es2015 到项目的部署环境中：npm install babel-preset-es2015 -D2.安装完成之后，在 .babelrc 文
2021-01-05 21:46:27
1894
1
原创 vue-particles插件(粒子特效)的使用
1.安装npm install vue-particles --save-dev2.main.js文件加入以下代码import Vue from 'vue'import VueParticles from 'vue-particles'Vue.use(VueParticles)3.在页面需要使用的地方直接使用<vue-particles color="#fff" :particleOpacity="0.7" :particlesNumber="70
2021-01-05 21:32:01
265
原创 使用vue-cli 3.x搭建vue项目详细步骤以及配置
1.在cmd下运行一下命令创建项目 vue create project-demo2.选择配置方式 选择 Manually select features3.手动配置项目需要的特性选择图中所勾选的Babel : Babel编译将ES6编译成ES5TypeScript: javascript类型的超集Progressive Web App (PWA) Support: 支持渐进式的网页应用程序Router:Vue路由Vuex: Vuex状态管理CSS Pre-processor
2021-01-04 17:39:51
407
原创 解决nginx配置不生效问题
测试环境下安装Windows版本的Nginx，修改配置过程中遇到更改配置后，配置不生效的问题，搜索半天没发现解决办法，重启也无效，于是打开进程管理器一看，果然看到了7-8个nginx进程，全部杀掉，然后再启动，OK，配置果然生效了...
2020-12-31 00:48:07
1142
原创 用jquery写选项卡按钮—— 排它思想
三行代码搞定$('.btn').on('click',function(){ if(!$(this).hasClass('active')){ $(this).addClass('active').siblings().removeClass('active') } }) //.btn为按钮的类名 //active为选中高亮的类名样式
2020-12-30 18:34:06
152
原创 swiper实现无限自动轮播
html區域 <!-- 轮播图区域开始--> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <img src="./images/1.jpg" alt=""> </div> <div class="swiper
2020-12-30 15:37:27
1933
原创 nginx的初体验及常用命令
第一步：打開nginx 會有黑色命令行框一閃而過 證明啓動成功了第二步：在當前nginx安裝的目錄文件下運行cmd，輸入下邊命令第三步：打開conf文件夾，找到nginx.conf配置文件第四步：可以開始配置反向代理了。每一次更改以後，記得要重啓nginx：命令：nginx -s reload常用的命令：查看nginx的版本號：nginx -v啓動nginx：start nginx快速停止或关闭nginx：nginx -s stop正常停止或关闭nginx：nginx -s qu
2020-12-30 15:16:03
104
原创 lay-ui里修改表格自动换行
lay-ui里修改表格自动换行加css样式， 解决一行文字较多溢出显示省略号的问题 .layui-fluid .layui-table-cell { line-height: 20px; padding: 5px 5px ; position: relative; box-sizing: border-box; text-align: center; overflow: visible; height:auto; overf
2020-12-19 22:24:57
293
1
原创 js常用的数组方法
1.数组常用的方法 arr.push() //在数组末尾添加的元素，返回新的长度 arr.pop()//删除数组末尾的元素，返回删除的元素 arr.unshift()//在数组开头添加元素，返回新长度 arr.shift()//删除数组的首个元素，返回删除的元素的值 arr.join()//数组转字符串 arr.slice(start,end)//数组截取，返回的是新数组 arr.splice(index,del,num)//从数组中指定下标
2020-12-02 19:56:54
201
原创 如何用白话描述vue双向数据绑定的原理？
用我自己的话来说就是，使用数据劫持加上发布者-订阅者的模式，通过Object.defineProperty()方法来劫持各个属性的setter和getter，Observe将对象数据的所有属性进行递归遍历，并加上setter和getter，这样一来，一旦数据发生改变就会触发setter，就能监听到数据的变化了；Compile对每个元素节点的指令进行扫描和解析，把里面的变量转换成数据，再进行初始化渲染页面，并且把每个指令对应的节点 绑定更新函数，然后添加用来监听数据变化的订阅者；而订阅者Watcher自身实例
2020-11-29 20:57:21
338
转载 Vue 核心之数据劫持
Vue框架核心之数据劫持前瞻当前前端界空前繁荣，各种框架横空出世，包括各类mvvm框架横行霸道，比如Angular、Regular、Vue、React等等，它们最大的优点就是可以实现数据绑定，再也不需要手动进行DOM操作了，它们实现的原理也基本上是脏检查或数据劫持。那么本文就以Vue框架出发，探索作者运用Object.defineProperty来实现数据劫持的奥秘（本文所选取的相关代码源自于Vue v2.0.3版本的源码）。回顾一下Object.defineProperty 语法Object.de
2020-11-28 15:02:13
367
原创 如何利用递归求斐波那契数列？
什么是递归？递归：函数在自己的内部，自己调用自己利用递归函数求斐波那契数列，也就是俗称的兔子序列 1、1、2、3、5、8、13、21、33…用户输入一个数字n，可以求出这个数字对应的兔子序列值 <script> function num(n) { if (n === 1 || n === 2) { return 1; } return num(n - 1) + num(n - 2); } console.log(
2020-11-26 20:03:33
1492
3
原创 如何通俗易懂的理解闭包？及作用？
说到闭包，那么什么是闭包呢？闭包（closure）：闭包是一个函数。函数内部还有一个访问了外层函数变量的一个函数就是闭包了。闭包的作用：延伸了变量的作用范围那么如何用闭包，点击li打印当前索引号呢？废话不多说，直接上代码<body> <ul> <li>晴天</li> <li>园游会</li> <li>爱的飞行日记</li> <li>七里
2020-11-26 18:54:06
610
原创 如何手动封装一个ajax请求？
如何手动封装一个ajax请求，用函数方式调用即可？废话不多说，直接上代码 <script> function MyAjax(params) { let xhr = new XMLHttpRequest(); //将传递过来的method 转换为大写 转小写也可以，为了后面的if判断条件 params.method = params.method.toUpperCase(); if (params.method === "GET") {
2020-11-26 09:57:28
223
2
原创 如何封装Promise对象？
可以参考promise规范Promise/A+如何封装一个简易的promise对象？废话不多说，直接上代码 <script> class MyPromise { constructor(executor) { // 初始化state赋值为pending this.state = "pending"; // 定义成功的 值 this.value = undefined; //定义失败的
2020-11-25 19:52:18
972
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人