- 博客(25)
- 收藏
- 关注
原创 uniapp调起打印机(调起第三方打印软件)适用app,将页面生成图片打印的两种方式
以下是封装的组件html部分 <view style="position: relative;width: 120px;height: 35px;overflow: hidden;"> <view class="test_btn" @click="canvas.createPoster">打印</view> <canvas canvas-id="myCanvas" id="myCanvas" :style="{position:'absolute',
2021-07-27 10:51:06
5591
原创 2021-07-19
uView ,element-ui等清除指定字段的校验uView ,element-ui等清除指定字段的校验 this.$refs["uForm"].fields[4].validateMessage = ''; this.$refs["uForm"].fields[4].validateState = '';
2021-07-19 11:24:22
262
原创 uniapp下载文件保存到手机
downloadFile(url){ console.log(url); const downloadTask = uni.downloadFile({ url:url, //文件链接 success: (res) => { if (res.statusCode === 200) { uni.saveFile({ tempFilePath: res.tempFilePath, success:(red)=> { .
2021-05-20 15:56:52
3353
原创 h5微信公众号调起微信内置地图
新建wxUtils.js文件import wx from "weixin-js-sdk";import { getJsapiSignature } from "@/api/weixin.js";export default { // 初始化SDK init(apiListParam, readyFunc) { let defaultApiList = ["hideOptionMenu", "showOptionMenu", "hideMenuItems", "show
2021-04-26 10:46:03
1815
原创 vue现实富文本内容太长显示省略号...,点击更多展示全部,伪类元素添加点击事件,伪元素设置宽高
更多按钮是通过伪元素追加到简介后面,并给他添加点击事件(父元素设置pointer-events:none;伪元素设置pointer-events:auto;)效果图html<div class="school_detail"> <p class="title">学校简介</p> <div> <div :class="isLength?'more_text':''" v-html="is
2021-04-26 10:13:34
1481
原创 vue全局注册指令 ----限制输入框只能输入正整数
新建directive.jsimport Vue from 'vue'export default () => { Vue.directive('Int', { inserted: function (el) { el.addEventListener("keypress",function(e){ e = e || window.event; let charcode = typeof e.charCode == 'number' ? e.
2021-04-23 18:43:26
396
原创 vue上传文件到Minio
封装js文件 file-uploader.jsvar Minio = require('minio');let s3 = new Minio.Client({ endPoint: '192.168.xxx.xxx', port: 9000, useSSL: false, accessKey: 'xxxx', secretKey: 'xxxx', Region:'xxxxxx',});//base64转bolbfunction dataURLto
2021-04-06 16:55:27
2488
1
原创 vue 搜索列表,搜索结果高亮,且页面滚动到指定位置
效果图如下:template部分代码://搜索框<el-input placeholder="请输入单位名称" prefix-icon="el-icon-search" @keyup.enter.native="searchCompany" v-model="search_key"></el-input>//列表 <div class="all_company" id="all_company" ref="all_company">
2021-04-05 17:07:12
494
原创 动态生成多个el-checkbox-group,控制每组的单选全选
效果图如下:template部分 <div class="all_company" id="all_company" ref="all_company"> <div class="industry_item" v-for="(item,index) in companyArr" :key="index"> <div @click="checkAllchange(index)"> <el-checkbox
2021-04-05 16:43:15
5402
原创 el-form嵌套多重循环的表单验证
<el-form :model="saveParams" :rules="rules" ref="ruleFormRef"> <el-form-item label="任务时间" label-width="100px" prop="endTime"> <el-date-picker :disabled="isDisabled" :picker-options="taskS.
2020-11-25 10:03:17
865
原创 el-tree控件的使用,提交与回显,解决半选中状态
<el-tree :data="menus" show-checkbox default-expand-all node-key="id" :default-checked-keys="menuIds" //选中项id组成的数组,如[1,2,3,4,5] ref="rootTree" :expand-on-click-node="false" :props="defaultProps"> </el-tree>export d.
2020-11-25 09:32:28
1351
原创 vue 图片上传并压缩
<template> <div id="vue-img-uploader"> <input type="file" accept="image/*" :id="componentId" @change="getFile"> <template v-if="files.length>0"> <div class="vue..
2020-08-24 11:32:54
1213
原创 vue项目实现从商品列表页跳转详情页后,返回列表页保持页面在原位置,且列表页刷新的方法
vue项目实现从商品列表页跳转详情页后,返回列表页保持页面在原位置,且列表页刷新的方法页面跳转后回退保持原位置App.vue页面中使用keep-alive缓存组件<template> <div id="app"> <keep-alive > <router-view v-if="$route.meta.keepAlive"></router-view> </keep-alive> <
2020-08-22 10:51:00
4277
1
原创 微信小程序转盘抽奖
<template> <div class="lottery"> <div class="lottery_background"> <div class="lottery_num"> <img src="/static/image/number_icon.png"...
2019-12-05 11:00:28
503
原创 mpvue循环列表给每项加定时器
mpvue循环列表给每项加定时器项目需求:给所有订单设置退款倒计时限制实现:html结构 <div v-for="(link,key) in orderList" :key="key"> <div> <p style="color: #C8000A">退款倒计时: <span id="co...
2019-12-05 10:53:55
460
原创 微信小程序头像用wx.getImageInfo获取失败
<button open-type="getUserInfo" lang="zh_CN" @getuserinfo="onGotUserInfo">同意</button> onGotUserInfo(e) { this.nickName=e.target.userInfo.nickName; wx.getImageInf...
2019-09-06 11:48:21
5709
原创 input type="file"上传文件
<div class="upload_div"> <input type="file" id="uploadBtn" type="submit" value="上传" accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"...
2019-05-16 18:24:54
804
原创 vue+webpack
1.npm init2.npm install webpack --save-dev //本地安装webpack3.webpack -v //查看webpack版本,看是否安装成功4.npm install -g vue-cli //安装vue-cli脚手构建工具通过以上步骤,我们需要准备的环境和工具都准备好了,接下来就开始使用vue-cli来构建项目5.使用命...
2019-04-16 09:37:01
887
原创 axios传参包含数组如何解决
this.axios.post('/api',Qs.stringify(data,{arrayFormat: 'repeat'})).then(res=>{ console.log(res.data) })
2019-04-12 18:11:20
1690
原创 iview的table渲染及js修改伪元素的值
此处用的是iview的table组件,项目中要根据后端传过来的颜色值改变表格中小雨滴的颜色 { title: '颜色', key: 'nameColor', render: (h, params) => { this.oil_color=params.row.nameColor ...
2019-04-12 18:06:15
404
原创 webpack打包时提示Invalid configuration object错误
webpack打包时,遇到上图错误,原因是这个webpack.config.js这个配置文件与我们当前安装的webpack版本不匹配configuration.module has an unknown property ‘loaders’.意思是webpack.config.js这个配置文件里的module属性有一个未知的配置项loaders,原因就是我们当前安装的webpack版本已经去...
2019-02-19 11:10:42
2541
1
原创 React学习Day02
构建:generator-react-webpack安装还是在命令行用npm进行安装,不过在全局安装generator-react-webpack之前,你可以先安装yeoman。命令如下:npm install -g yonpm install -g generator-react-webpack创建目录我们先用命令自行创建一个文件:new-react-demomkdir new-r...
2019-02-18 15:55:06
94
原创 React学习Day01
React学习Day01create-react-app的安装安装需要在命令行中进行,在安装create-react-app前,你需要安装node。然后在命令行中输入下面的命令:windows系统下:npm install -g create-react-appLiunx和Mac电脑下:sudo npm install -g create-react-app但这种方式的webpa...
2019-02-18 15:41:19
174
原创 web前端学习分享
web前端学习之路阶段1(服务器端):项目导入/MySQL数据库/JS基础/ NodeJS **阶段2(前端核心技术):**HTML/AJAX/CSS/BOOTSTRAP **阶段3(前端进阶技术):**JS高级/BOM&amp;amp;DOM/JQuery/VueJS **阶段4(h5移动开发):**VueJS组件库/HTML5/微信开发/HybirdApp **阶段5(框架技术):...
2018-08-03 21:39:48
203
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人