- 博客(32)
- 收藏
- 关注
RSS订阅
原创 el-input限制只输入数字,elment后一个输入框大于第一个输入框值,elment两个表单关联
template <el-row :gutter="14" style="display: flex"> <el-form-item label="发送对象" prop="startObj"> <el-input v-model="bulletin.startObj" type="number" style="width:100px" /> </el-form-item>...
2021-08-11 17:39:54
2038
1
原创 el-input 显示剩余字数 elment表单显示剩余字数 textarea显示剩余字数
template<el-form :model="bulletin" :rules="rules" ref="ruleForm" label-width="200px" class="demo-ruleForm"> <el-form-item label="模板内容：" prop="content"> <div class="form-conten"> <el-input type="textare..
2021-08-11 17:19:37
907
原创 echarts异形图 异形柱状图
<template> <div class="institutions"> <div ref="chart" style="width:100%;height:100%"></div> </div></template><script>import echarts from "echarts/lib/echarts";import 'echarts/lib/chart/bar'i.
2021-07-23 17:15:10
842
原创 vue highcharts 3d环形图
安装npm install -S vue-highchartsmain.js引入import Highcharts from 'highcharts' import Highcharts3d from 'highcharts/highcharts-3d' Highcharts3d(Highcharts)静态测试代码<template> <div class="charts" style="width:100%;height:100%"> ..
2021-07-23 15:45:32
1240
1
原创 vue动态加载本地背景图（v-for循环背景图）
template中 :style="item.imageUrl<div class="resources-box" v-for="item in aginList" :key="item.id" :style="item.imageUrl"> <div> <CountTo class="number" :startVal='0' :endVal='item.value' :duration='1000'></CountTo&..
2021-07-23 15:31:20
3099
原创 el-upload单张图片上传回显替换
<el-form :model="bulletin" ref="bulletin" label-width="90px"> <el-form-item label="头像："> <el-upload class="upload-demo upload" drag :show-file-list="false" :action="uplo..
2021-06-24 15:35:10
2086
原创 echart 详细配置（vue脚手架）
echart 详细配置（vue脚手架）通用配置<template> <div> <div ref="main" style="width: 100%;height:400px;"></div> </div></template><script>import echarts from 'echarts'export default { name: 'AskFor', mounted ()
2021-04-20 16:27:25
176
原创 useState更新复杂数据（无状态组件）
useState数组（简单）//定义数据const [data,setData]=useState([1,2,3])//点击在data数据添加一个4 const clickAdd()=>{ setData( ()=>{ data.push(4); return [...data] } ) } //点击按钮 <button onClick={()=>clickAdd
2021-01-05 17:40:54
4788
1
原创 uni-app项目实战
接口文档推荐: http://service.picasso.adesk.com/v3/homepage/vertical专辑 http://service.picasso.adesk.com/v1/wallpaper/album分类: http://service.picasso.adesk.com/v1/vertical/category分类-最新-热门 http://service.picasso.adesk.com/v1/vertical/category/id/vertical专辑htt.
2020-11-09 20:47:32
3333
4
原创 vue拖拽组件自定义指令，解决拖拽和点击事件冲突问题，解决拖拽组件在iframe上面延迟卡顿问题
/解决onmouseup事件有时候不触发 if(el . stopPropagation) {
2023-05-06 15:59:06
1720
原创 vue封装steps组件(自适应)
stepsModel组件<!-- Step.vue --><template> <div class="stepOut"> <!-- 步骤条 --> <ul> <li class="stepItem" v-for="(stepItem, index) in stepInfo.list" :key="index"> <!-- 圆圈 --> <di.
2022-04-19 14:51:41
1796
原创 vue中video标签，仅允许一个播放，其余暂停播放；vue获取不到video.length
template结构（video动态生成）<div v-for="(item, index) in List" :key="index"> <video controls :src="item.url"></video> </div>methods 函数vue中获取video标签集合videos，输出videos.length为0，必须使用this.$nexTickfor循环注意使用闭包或者自定义属性解决循环之后只给最后一个元素绑定.
2022-03-17 13:15:09
2240
原创 iview根据接口动态设置table列的显示隐藏
moutedthis.setHandleColumns()methodssetHandleColumns() {// 调用判断接口 this.XXX可以获取到后台返回的数据，根据后台返回数据实现是否显示 this.XXX().then(res => { this.handleColumns() })},//过滤表头handleColumns(){ if(判断数据){ this.tableColumns = this.tab..
2022-01-17 15:09:28
1249
原创 vue点击按钮拷贝文本网址（iview）
template<Form ref="formInline" :model="formInline" :rules="ruleInline"> <FormItem style="width:560px" class="copyConnect" prop="url" > <Input v-model="formInline.url" type="textarea" :rows="4"/> <button @click="to.
2021-11-24 09:24:28
755
原创 微信小程序背景音乐InnerAudioContext 微信额外提示音
定义一个页面全局变量（在onLoad同级）innerAudioContext: null,在onReady生命周期/* * 生命周期函数--监听页面初次渲染完成*/ onReady:function() { this.innerAudioContext = wx.createInnerAudioContext() this.innerAudioContext.autoplay = true this.innerAudioContext.loop = true.
2021-10-28 23:52:34
434
原创 el-upload多张图片上传回显删除
templatesetImag是获取url进行回显，这是根据后台返回数据写的（怎么写看后台数据结构是什么样的）<el-table-column prop="pic" label="服务图片" > <template slot-scope="scope"> <img :src="scope.row.pic?setImag(scope.row.pic): null" style="width:80px;height:60px"/>..
2021-09-07 09:13:54
1357
原创 vue使用element三级联动下拉框多选
选中高级软件和软件ui工程师之后，一级中的金融和工程也高亮了，这是因为后台返回数据的id（这里后台返回的categoryId值重复）值重复了template<el-form-item label="职位类别：" prop="listJobCategoryDTOLIN"> <el-cascader :change-on-select="false" :props="defaultParams" :options="options" ..
2021-09-01 09:52:17
1607
原创 el-upload自定义上传样式 el-upload上传后回显为表格数据
templateaction 必选参数，上传后台接口地址data 上传时附带的额外参数（图片2）on-success 上传成功执行函数headers 设置上传的请求头部multiple 是否支持多选文件,可以不写:limit=“3” 最大允许上传个数,可以不写<div> <div class="medical-title"> <p class="card-title">体检报告</p> <el..
2021-08-31 09:51:34
2822
2
原创 el-dialog自定义样式 清除表单 自定义表单验证
template:show-close="false"是关闭默认的X号,slot="title"自定义一个X@close是弹窗关闭会触发，@close='closeDialog’关闭之后清空验证<!-- 按钮 --> <el-row class="btn-list"> <el-button @click="dialogVisibleClick">新增</el-button> </el-row><!-- 新增弹窗 .
2021-08-17 14:31:17
518
原创 elementui table 第一列内容相同 自动合并单元格 el-table第一列内容相同自动合并
template( :span-method=“objectSpanMethod”)<!-- 表格 --> <el-table :data="tableData" style="width: 80%; margin: 20px" :header-cell-style="{background: '#F8F8F8', height: '40px', padding: '0', color: '#333333'}" border .
2021-08-17 09:45:15
1812
1
原创 el-table翻页记录已选状态 el-table翻页回显记录已选状态
需求：点击第一页选中三条数据，点击第二页选中1条，再点击第一页显示选中的三条…template@selection-change="selectionTableDtaChange"是勾选会触发的事件:row-key="getRowKeys是跨页多选row-key"type="selection"设置为:reserve-selection="true"<el-table ref="elderTable" :data="elderData" style="width:100%" v-loadi.
2021-08-13 11:17:19
945
原创 el-table自定义表头样式 两个标题并且标题颜色不同
<el-table :data="disabilityData" id="table" border :header-cell-style="{background:'#F7F7F8', color:'#18191B'}"> <el-table-column type="index" label="序号" width="50" align="center"></el-table-column> </el-table>关键代码...
2021-08-11 17:28:51
3385
原创 echarts刷新不显示 报错Component series.pictorialBar not exists. Load it first
× Error: Component series.line not exists. Load it first.错误引入import echarts from "echarts/lib/echarts"import 'echarts/lib/chart/bar'import 'echarts/lib/component/tooltip'正确import 'echarts/lib/chart/bar'import 'echarts/lib/component/tooltip'import
2021-07-28 17:46:41
1074
1
原创 已有项目托管到git码云
创建一个空仓库全局配置gitgit config --global user.name "XXX"git config --global user.email "XXXXX+XXXX@XXX.gitee.com"局部配置gitgit initgit remote add origin https://gitee.com/XXX/XXX.gitgit add .git commit -m "XXX"git push -u origin master...
2021-07-06 10:35:41
67
原创 vue的mixins
①创建base.jsbase.js存放我抽离出来的数据或者方法，这里再src/api/base.js(路径随意)加入组件中有一个方法onSunmit,base.js中也有一个相同的函数onSunmit,那么采用就近原则进行调用，即调用组件自身的函数const baseMinxin = {// 公共数据 data () { msg: 12345 }, methods: { // 公共方法 onSunmit () { console.log('点击查询', t
2021-01-28 15:03:08
108
原创 react+antd后台管理-01
环境创建创建项目npm create-react-app 项目名称安装antdnpm install antd安装路由npm install react-router-dom启动npm start测试antd安装坏境引入antd.cssimport 'antd/dist/antd.css按需引入antd组件import {Button} from 'antd';使用antd组件检测<Button type="primary">测试</Button>
2020-11-28 13:55:35
290
原创 react配置反向代理
查找node-modules-react-script-coifig-webpackDevServer-proxy命令行配置代码"proxy": { //配置项 "/api": {//我们可以在这里设置个口令 "target": "https://xxx.com/",//target是api服务器地址 "changeOrigin": true, //这个是是否替换这里一定要写true "pa..
2020-11-26 08:20:51
446
原创 vue-cli+ElementUi
安装vue安装webpacknpm install webpack -g安装webpack-clinpm install webpack webpack-cli -g安装vue-clinpm install vue-cli -g创建项目vue init webpack 项目名
2020-11-24 08:38:44
118
原创 jquary基础
什么是jQuary简单来说，一个js库；将原生的js封装成方法，便于我们使用jQuary的优点减轻搽脸面膜纸兼容性：好，适配所有浏览器轻量级：只有几kb，体积比较小，渲染比较快支持插件扩展链式调用：隐式迭代免费开源jQuary对象和DOM对象console.dir(元素) 可以检验获取的是jQuery还是DOMjQuary：通过jQUary获取的对象(维数组的形式)$("div");jQuary转化为DOM$("div")[index索引值]$("d
2020-11-19 07:36:48
180
原创 脚手架使用Moment.js
安装moment官网npm安装npm install moment引入(在)import moment from 'moment'使用this.month.yue=moment(this.month.stime).format('M');this.month.ri=moment(this.month.stime).format('D');
2020-11-10 19:15:41
135
原创 uni-app+脚手架使用
脚手架的搭建1.全局安装npm install -g @vue/cli2.创建项目vue create -p dcloudio/uni-preset-vue my-project3.启动项目npm run dev:mp-weixin4.导入项目至微信开发者工具样式和sass支持小程序的rpx、和h5的vw、vhnpm install sass-loader node-sass在vue的组件中，在style标签上加上<style lang="sass">uni
2020-11-09 19:34:52
1287
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人