- 博客(74)
- 收藏
- 关注
RSS订阅原创 小程序富文本解析(mp-html组件)
微信小程序解析html大概有几种方式，我用过的有这三种rich-textweb-viewwxParsemp-html，各有各的优缺点，亲测，发现还是mp-html好用点。废话不多说，直接上代码。
2023-11-17 11:22:59
443
原创 element UI中table操作栏更多按钮展示与折叠的实现
Element UI中table操作栏更多按钮展示与折叠的实现1、然后给大家看下动态图2、解决思路： 一开始我的第一反应就是可以手写一个定位布局来点击弹出更多按钮弹框，后面看了下elementUI文档上有个组件可以利用，那就是Popover 弹出框废话不多说，直接上代码吧html代码块：<el-table :data="locationList" v-loading="loading" border class="table" ref="multipleTable" @selectio
2022-04-21 17:28:18
11569
4
原创 ant desgin vue table动态循环生成表格
场景： 根据选择日期年月份进行动态往表格添加数项话不多说，下面直接上代码一、html代码<!-- 表格 --><div class="admin_table_list"> <a-spin tip="Loading..." :spinning="spinning"> <a-table bordered size="small" :rowkey="id" :comp
2021-12-21 14:53:43
3269
2
原创 Vue项目中如何使用动画特效
一、安装在命令行中执行：使用npm或者cnpm安装npm install animate.css --save 或 cnpm install animate.css --save二、引入在main.js全局引入import animate from 'animate.css'......Vue.use(animate)//记得引入使用三、页面使用在index.vue中<template> <div class="box"> <button @c
2021-09-11 17:18:06
2673
原创 微信小程序点击图片预览真机无法显示的问题
问题： 用开发者工具开发编辑时，点击图片预览，一直显示黑屏加载转圈中…如图所示：实际效果图：话不多说，直接上代码1、html代码：<view class="img-box"> <view class="imgs" wx:for="{{imgList}}" wx:key='id'> <image src="{{item.imgurl}}" bindtap="clickImg" data-url="{{item.imgurl}}" />
2021-08-27 11:30:35
1539
3
原创 Vue 使用element-UI 上传图片及图片回显
问题描述： 将后台接口返回的图片，回显到页面1、html代码<el-form-item label="房间图片:" prop="images"> <el-upload :action="action" list-type="picture-card" :accept="accept" :auto-upload="true" :limit="imgLimit" :multiple="isMultiple" :file-list="form.images" :
2021-08-24 14:31:21
3750
7
原创 Vue项目点击跳转外部链接
问题描述：在Vue项目页面中，点击某个按钮，跳转到项目外其他链接页面1、页面点击覆盖当前页面window.location.href = 'https://www.baidu.com'2、点击重新打开一个页面窗口，不覆盖当前的页面 window.open('https://www.baidu.com',"_blank") "_blank" 新打开一个窗口 "_self" 覆盖当前的窗口...
2021-08-13 15:20:45
3939
原创 VUE跨域问题
问题描述：Vue发送请求的时候存在跨域，不能请求到正确数据，控制台报错如下：Access to XMLHttpRequest at 'http://localhost:8000/equip_fault_report/all' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested re
2021-08-13 15:17:30
306
原创 ES6常见数组用法
这是看完ES6文档后的学习笔记1、let与constlet的用法类似于var，但是所声明的遍历，只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1const声明一个只读的变量。一旦声明，常量的值就不能改变。const PI = 3.1415;PI // 3.1415PI = 3;// TypeError: Assignment to constant .
2021-07-31 15:27:52
235
原创 Vue项目H5移动端在线预览PDF文件
1、安装pdfh5插件npm install pdfh5 --save2、使用<template> <div id="app"> <div id="demo"></div> </div></template><script> import Pdfh5 from "pdfh5"; export default { name: 'App', data() { return {
2021-07-14 09:43:43
1780
11
原创 Vue实现打印功能最简单的方法
摘要： 今天做了一个ERP系统打印订单的功能，下面是效果图：查了很多资料，一开始我直接用print.js这个插件，虽然能实现打印功能，但是当你需要打印的表格数据太多了，就无法实现分页打印，为了不浪费大家时间，所以在这里，我建议大家直接使用vue-print-nb这个插件，可以随心所欲的实现打印功能。在这里我就不多说了，用了就知道！下面说下安装和使用方法：1、安装vue-print-nbnpm install vue-print-nb --save2、在main.js文件中引入 import
2021-07-09 11:44:57
5647
33
原创 vue项目导出word文件(根据word模板导出)
一、安装依赖包1、docxtemplaternpm install docxtemplater pizzip -S2、jszip-utilsnpm install jszip-utils -S3、pizzipnpm install pizzip -S4、FileSavernpm install file-saver --save二、创建Word模板根据格式样式要求，打开电脑桌面新建一个Word文档，调成需要导出的格式样式做为导出模板。数据使用{变量}代替模板存放位置：使用v
2021-07-06 11:30:28
4979
14
原创 Vue项目点击刷新页面的三种方式
Vue项目点击刷新页面的三种方式一、原生js刷新方式：location.reload();二、Vue框架自带的路由跳转方式：this.$router.go(0);三、在App.vue页面声明以下代码：<template> <div id="app"> <router-view v-if="isShow"/> </div></template><script>export default { n
2021-06-29 09:36:07
4067
原创 Ant desgin vue 表格滑动效果：
Ant desgin vue 表格自适应可滑动效果1.html代码块：<!-- 表格 --> <div class="admin_table_list"> <a-table :rowkey="id" bordered size="small" :components="components" :rowSelection="{ selectedRowKeys: selectedRowKeys, onCha
2021-05-14 17:09:52
1247
原创 ant desgin vue 列表分页
ant desgin vue 表格列表分页1、html代码块：记得把这个表格自带的分页关闭了:pagination="false"<!-- 表格 --> <div class="admin_table_list"> <a-table bordered :rowkey="id" :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onS
2021-05-08 15:26:34
539
原创 git 打标签（Tag） 操作
git 打标签（Tag） 操作创建标签git tag -a '版本号' -m '备注信息' 推送标签git push origin --tags(标签名)
2021-04-30 19:58:06
205
2
原创 微信小程序实现吸顶效果
微信小程序实现吸顶效果这篇文章主要为大家详细介绍了微信小程序实现吸顶效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下最开始的时候，在小程序中实现吸顶效果，开发工具看起来还挺好的，但是在真机上就会有问题了。 原因是我不停的去 setData 会导致操作反馈延迟严重，无法及时将操作处理结果及时传递到视图层。后面就对代码进行了调整，避免不停的去setData效果图吸顶前吸顶后代码部分wxml<view style="width: 90%; hei
2020-11-10 21:06:14
3650
原创 如何使用Git生成SSH密钥
Git生成SSH密钥配置用户名git config --global user.name "zhangsan"配置邮箱git config --global user.email "[email protected]"如下图所示：此时，会在C:\Users\Administrator目录下生成.gitconfig配置文件：请勿删除！ssh-keygen -t rsa -C "123123123qq.com"生成公钥和私钥按3次Enter，不需要设置名称与密码cat ~/.ssh
2020-10-28 15:36:51
662
原创 PC端扫码登录流程图
PC端扫码登录流程图下面是个人自己整理的流程图，不足之处还望大家指正一起探讨#mermaid-svg-E9ZdhGDHZ9BYpC58 .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-E9ZdhGDHZ9BYpC58 .label text{fill:#333}#mermaid-svg-E9ZdhGDHZ9
2020-10-26 17:08:55
1286
原创 常用的js语法
常用的js语法1、提取数组对象中的某个属性值，并返回一个新数组//实例一：单纯的提取数组对象中的某个属性值，返回一个数组var detailList = [ { id:1, name:'张三' }, { id:2, name:'李四' }, { id:3, name:'王五' },
2020-10-16 17:56:47
378
原创 Vue项目登录加密
前端Vue项目-登录加密-crypto-js加密 AES加密今天做了Vue项目的加密，主要做了登录接口，保证登录的安全性能。网上关于 AES 对称加密的算法介绍挺多的，对这一块还不是特别理解的小伙伴可自行百度，这里我推荐一篇AES加密算法的详细介绍与实现，讲的还是蛮详细的~要用 AES 算法加密，首先我们要引入 crypto-js ，crypto-js 是一个纯 javascript 写的加密算法类库 ，可以非常方便地在 javascript 进行 MD5、SH
2020-08-31 18:14:35
2086
1
原创 数组的push()、pop()、shift()和unshift()方法讲解
数组的push()、pop()、shift()和unshift()方法avaScript的数组是一个拥有堆栈和队列自身优点的global对象。也就是说JavaScript数组可以表现的像栈(LIFO)和队列(FIFO)一样操作。这也是JavaScript数组强大的可操作性的体现。堆栈和队列栈和队列都：是动态的集合，在栈中，可以去掉的元素是最近插入的那一个。栈实现了后进先出。在队列中，可以去掉的元素总是在集合中存在的时间最长的那一个。队列实现了先进先出的策略。堆栈的基本概念先上张图：ECM
2020-08-31 18:13:30
365
原创 如何改变数组对象里面的key 键名字
如何改变数组对象里面的key 键名字看网上有很多封装好的方法也是可以直接拿来用，但是太长，记不住，所以用map解决是个不错的选择！！！和后端交互过程中，存在他给的数组里的键名并不是我们想要的。我们就需要改成我们想要的名字，这样方便我们取值来用。例如： var arr = [{ a: 'key1', b: 'value1' }, { a: 'key2', b: 'value2'
2020-08-31 18:12:40
5745
6
原创 git从克隆项目到本地分支和远程分支关联
git从克隆项目到本地分支和远程分支关联1、克隆项目git clone http://git.xxx.com/xxx.git克隆远程仓库的代码到本地后，想提交本地代码到远程仓库，这时候就需要先将本地仓库与远程仓库进行关联，否则无法直接上传到远程仓库。2.创建分支git branch develop3.查看本地分支：git branch**注:**名称前面加*号的是当前的分支4.查看远程分支：加上-a参数可以查看远程分支，远程分支会用红色表示出来（如果你开了颜色支持的话）git
2020-08-17 15:44:45
2252
原创 Vant-UI库和Element-UI库修改样式无效
Vant-UI库和Element-UI库修改样式无效最近用vue写页面时，发现使用vant的有些UI组件，而又不能满足自己的样式，修改CSS样式还是无效。css一般都会使用sass或者less，加了scoped后修改的样式不起作用，即使加了important也没用.van-grid-item_content{ background:#f4f5f7 !important; border-radius:8px;}vue项目中，当style标签有scoped属性时，它的 CSS 样式只作用
2020-07-10 11:45:13
1464
原创 H5 移动端调取手机相机或相册
H5 移动端调取手机相机或相册1、html代码如下： <!--图片二--> <label for="xFile2" style="padding-top:15px;" class=" cameraImg2" @click="removeImg2();"> <span v-if="imgList2.length == ''" class="glyphicon-camera" > <p style
2020-07-08 11:57:59
5868
原创 H5页面调用手机打电话功能
H5页面调用手机打电话功能摘要：H5也就是移动端head里面加上：<meta name="format-detection"content="telephone=yes"/>需要拨打电话的地方：<a href="tel:400-0000-688">400-0000-688</a>发短信：<a href="sms:18688888888">发短信</a>点击 页面上的电话号码，页面会调用手机的电话接口。...
2020-07-08 11:52:30
1203
原创 小程序——切割字符串
小程序——切割字符串做完项目整理了下小程序的字符串切割的常见几种方法JS对字符串进行切割截取1.函数：split()功能：使用一个指定的分隔符把一个字符串分割存储到数组例子：str=”jpg|bmp|gif|ico|png”; arr=str.split(”|”);//arr是一个包含字符值”jpg”、”bmp”、”gif”、”ico”和”png”的数组2.函数：join()功能：使用您选择的分隔符将一个数组合并为一个字符串例子：var delimitedString=my
2020-07-01 17:45:48
9595
原创 微信小程序下拉刷新上拉加载更多
微信小程序下拉刷新/上拉加载更多前言：今天说说小程序的分页功能做这个功能之前，咱们可以先看看微信小程序官方文档，有这个API的查看文档，在用page()函数注册页面的时候有这样的两个对象参数用户判断用户在最顶部下拉和到达最底部在小程序里，用户顶部下拉是默认禁止的，我们需要把他设置为启用，在app.json中的设置对所有页面有效，在单独页面设置则对当前页面有效；看一下json文件："enablePullDownRefresh": true,有同学说设置完之后可以下拉，但是看不到图标；在
2020-06-16 10:56:01
858
原创 Ant Design Pro of Vue——蚂蚁金服中后台系统框架搭建
Ant Design Pro of Vue——蚂蚁金服中后台系统框架搭建Ant Design Pro of Vue下载安装启动步骤：一、Ant Design Pro of Vue 的介绍Ant Design Pro 是一个企业级中后台前端/设计解决方案，我们秉承 Ant Design 的设计价值观，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。因为Ant Design Pro of V
2020-05-26 18:10:15
13079
11
原创 vue-cli项目中使用mockjs（基础使用和全局配置使用）
vue-cli项目中使用mockjs（基础使用和全局配置使用）很多时候前后端分离的项目在开发过程中前端所需数据和后端接口并不会同步开发，此时在接口对接之前就可以使用mockjs来自定义模拟数据vue项目中的请求一般也是使用Axios进行请求，而axios的的一个特点就是会自动拦截请求，今天搞了一下午，也参考了很多文章，差不多完成了demoaxios的使用参考官网。脚手架搭建好之后npm install mockjs // 安装mockjsnpm install axios // 安装axios
2020-05-13 18:11:04
2012
1
原创 vue中路由跳转的三种方式 简洁易懂
vue中路由跳转的三种方式 简洁易懂router-view 实现路由内容的地方，引入组件时写到需要引入的地方需要注意的是，使用vue-router控制路由则必须router-view作为容器。通过路由跳转的三种方式1.router-link1. 不带参数<router-link :to="{name:'home'}"> <router-link :to="...
2019-12-21 11:42:59
1742
原创 使用Vue-cli 3.0搭建Vue项目
使用Vue-cli 3.0搭建Vue项目[2018-07-31更新]： vue-cli 3.0正式版的中文文档已经出来了，详细的可以参考：https://cli.vuejs.org/zh/guide/关于Vue的其他基础知识，可以看我的文章（持续更新中）：\1. Vue入门（1）——简介与安装Vue CLI介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供：...
2019-12-19 09:43:42
209
原创 快速搭建一个完整的vue的项目
搭建一个完整的vue的项目Vue CLI介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供：通过 @vue/cli 搭建交互式的项目脚手架。通过 @vue/cli + @vue/cli-service-global 快速开始零配置原型开发。一个运行时依赖 (@vue/cli-service)，该依赖：可升级；基于 webpack 构建，并带有合理的默认...
2019-12-19 09:41:03
1230
原创 一、Canvas应用的背景(个人理解)及基础语法
一、Canvas应用的背景(个人理解)及基础语法基础语法Canvas本质是一个可以使用脚本(通常为JavaScript)来绘制图形的 HTML 元素，默认大小为300像素×150像素(宽×高，像素的单位是px),通过JavaScript上下文对象动态创建图像。比如，画线、画矩形、涂颜色甚至生成带二维码的海报。原理就是一笔一笔的画，画一条横线，再画一条横线等等，就是不断地创建路径、绘制路径，然后...
2019-12-19 09:39:00
278
原创 非常全面的前端协作规范
非常全面的前端协作规范万字长文，继续刷新我的文章长度记录，涉及前端开发的方方面面。本文将持续更新和完善, 文章部分观点可能比较武断或不完整，欢迎评论和补充，一起完善该文章. 谢谢笔者长期单枪匹马在前端领域厮杀(言外之意就是团队就一个人)，自己就是规范。随着公司业务的扩展，扩充了一些人员，这时候就要开始考虑协作和编码规范问题了。本文记录了笔者在制定前端协作规范时的一些思考，希望能给你们也带来...
2019-10-14 10:33:33
2607
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人