![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
aitengteng1
这个作者很懒,什么都没留下…
展开
-
Echarts正负条形图将x轴都设置成正数的例子
echarts的正负条形图都调整为正数原创 2022-11-02 17:33:45 · 370 阅读 · 1 评论 -
动态表头导致表格底部留白问题
解决动态表头的表格的底部留白问题原创 2022-09-26 13:45:23 · 515 阅读 · 0 评论 -
对表单进行单独校验
this.$refs[form].validateField(‘mobile’, valid => {if(valid) {// 表单验证通过}})原创 2021-07-16 16:21:41 · 514 阅读 · 0 评论 -
监听屏幕的高度和宽度,缩放时监控
watch: { 'screenWidth':function (val) { console.log('ssaa', val) // 计算屏幕宽度 let height=document.body.scrollWidth - 500; this.mapHeight=height +'px'; } }, mounted(){ this.roadMap() this.$api.commonsupAPI.findChildr原创 2021-07-08 18:04:29 · 544 阅读 · 0 评论 -
nuxt多级菜单写法
1.页面<div class="top_two_menu"> <el-menu :default-active="activeIndex" mode="horizontal" @select="handleSelectMenu"> <template v-for="(item,index) in menuData" > <el-submen原创 2021-07-08 15:11:36 · 547 阅读 · 0 评论 -
nuxt中element表单使用自定义校验
1.nuxt中nuxt.config.js plugins: [ { src:"~/plugins/element-ui", ssr:false//关闭服务端 }, { src:"~/plugins/vue-map", ssr:false }, { src:"~/plugins/echarts" }, { src:'~/plugins/nuxt-swiper', ss原创 2021-06-11 16:15:45 · 345 阅读 · 0 评论 -
nuxt中使用高德地图sdk
1.在plugins中新建vue-map.jsimport Vue from ‘vue’;//引入高德地图import VueAMap from ‘vue-amap’;Vue.use(VueAMap);//初始化//if(!Vue.prototype.$isServer){VueAMap.initAMapApiLoader({// 高德keykey: ‘key’, // 高德 Key// 插件集合 (插件按需引入)plugin: [‘AMap.Autocomplete’, // 输入原创 2021-06-07 15:02:00 · 1066 阅读 · 1 评论 -
vue实现跑马灯效果
timer:null,recentTradestr:'',recentTrade:[],方法原创 2021-05-28 16:06:43 · 57 阅读 · 0 评论 -
nuxt封装axios
1.首先编写request.js//拦截importaxiosfrom'axios'//根据环境变量区分接口的默认地址,在package.json中配置//"dev:test":"setNODE_ENV=test&&nuxt",//switch(process.env.NODE_ENV){//case"production"://axios.defaults.baseURL="http://api.zhufeng.cn";...原创 2021-05-26 17:28:37 · 389 阅读 · 0 评论 -
el-element使用本地自定义图标
在assets中编写个css.el-icon-one{background-image:url('../../static/image/personal/1.png');background-size:100%100%;width:20px;height:20px;}.el-icon-two{background-image:url('../../static/image/personal/2.png');backgr...原创 2021-05-12 15:43:57 · 1675 阅读 · 1 评论 -
vue中父给子传值
父亲:<template><divclass="con"><divclass="one"><divclass="one_left"><divclass="one_route">当前位置:</div><el-breadcrumbseparator-class="el-icon-arrow-...原创 2021-05-11 16:27:48 · 157 阅读 · 0 评论 -
elementui二级菜单
<el-menurouter:default-active="activeIndex"mode="horizontal"@select="handleSelectMenu"><!--<el-menu-itemstyle="border:none"v-for="(item,index)inmenuData":index="index+''":key="index":route="{name:item.routername}...原创 2021-05-10 15:46:19 · 2265 阅读 · 0 评论 -
swiper商品缩略图和大图点击时联动
<divclass="imgshow"><swiper:options="swiperOption"ref="swiperTop"class="swiper-no-swiping"><!--<divclass="swiper-wrapper">--><swiper-slide...原创 2021-04-27 16:12:02 · 1569 阅读 · 0 评论 -
修改el-table样式
tableRowStyle({row,rowIndex}){if(rowIndex===0){letjson={'color':'#FFFF54'}returnjson;}},<el-table:data="tableData"...原创 2021-04-27 16:06:27 · 143 阅读 · 0 评论 -
el-table向上滚动
mounted(){// 拿到表格挂载后的真实DOMconst table = this.$refs.table// 拿到表格中承载数据的div元素const divData = table.bodyWrapper// 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素)setInterval(() => {// 元素自增距离顶部1像素divData.scrollTop =divData.scrollTop+1;// 判断元素是否...原创 2021-04-16 17:01:27 · 756 阅读 · 1 评论 -
el-table滚动条样式
/deep/ .el-table__body-wrapper::-webkit-scrollbar {width: 6px;height: 6px;}/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {background-color: rgba(3, 168, 242, 0.1);border-radius: 3px;}原创 2021-04-16 16:58:24 · 150 阅读 · 0 评论 -
修改滚动条样式
*::-webkit-scrollbar {width:7px; height:10px; background-color:transparent;} /定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸/*::-webkit-scrollbar-track {background-color:#f0f6ff; } /定义滚动条轨道 内阴影+圆角/*::-webkit-scrollbar-thumb {background-color:#73abb1; border-radius:6px;} /定义原创 2021-04-16 16:16:31 · 82 阅读 · 0 评论 -
vuex二级获取,控制公共头部与尾部的展示和隐藏
login.jsexportconststate=()=>({headerShow:false,footShow:false})exportconstmutations={M_UPDATE_HEADSHOW(state,payload){state.headerShow=payload;},M_UPDATE_FOOTSHOW(state,payload){state....原创 2021-04-07 15:57:56 · 166 阅读 · 0 评论 -
nuxt中使用vuex
在store下新建index.js//主模块//stateexport const state=()=>({searchName:’’})export const mutations={M_UPDATE_SEARCHNAME(state,payload){state.searchName=payload;}}export const actions={A_UPDATE_SEARCHNAME({commit},payload){commit(‘M_UPDATE_SEARCHNA原创 2021-03-31 14:17:26 · 144 阅读 · 0 评论 -
npm run dev时报错
verbose npm v6.14.4error code ELIFECYCLEerror errno 1error vue-admin-template@4.2.1 dev: `vue-cli-service serve`error Exit status 1error Failed at the vue-admin-template@4.2.1 dev script.error This is probably not a problem with npm. There is l原创 2020-12-08 14:47:02 · 1065 阅读 · 0 评论 -
elementui过滤后树形展示全选问题,会全选所有的数据,并不是筛选后的数据解决方案
chose24Node(data,checked){//console.log(data);//console.log(this.$refs.tree);//console.log(this.$refs.tree.getCheckedNodes());//console.log(this.$refs.tree.getCheckedKeys());letcheckArr=this.$refs.tree24.get...原创 2020-08-12 17:04:06 · 2169 阅读 · 2 评论 -
el-tree回显父节点半选问题
当选中父节点下其中一个子节点时,把父节点和子节点都存储到库中做顶部菜单展示,回显时使用以下方法进行半选展示。fetchRoleTree获取到库中存的父节点id和子节点的idfetchRoleTree(this.$route.query.roleId).then(res=>{console.log(res.data+"eeeeeee");//this.checkedKeys=res.data;res.data.forEach((i,n)...原创 2020-07-11 15:40:54 · 3324 阅读 · 0 评论 -
实现输入域点击光标后增加想要的内容
实现效果:insertInputTxt(id,insertTxt){letelInput=document.getElementById(id);letstartPos=elInput.selectionStart;letendPos=elInput.selectionEnd;if(startPos===undefined||endPos===undefined){return;...原创 2020-07-08 16:28:13 · 263 阅读 · 0 评论 -
对于VUE的跨域问题
对于跨域问题,我们访问后台的地址为配置在nginx的地址,不是内网地址也不是对外的外网地址,nginx配置好地址后即可使用,跨域是可以接收到请求的只是得不到后台的响应...原创 2019-12-13 14:57:41 · 95 阅读 · 0 评论 -
axios(post方法) + vue 方法导出excel文件(已解决导出乱码问题)
仅附上前台代码,axios({method:'post',url:'http://120.55.173.161:8088/api/business/ctl/webQueryOrderList',//测试data:qs.stringify(this.paramsOrder),...原创 2019-12-13 14:56:12 · 732 阅读 · 0 评论 -
vue的v-for注意事项
value不能为空,否则value为空的那一项就会显示在select的框中原创 2019-11-13 15:13:45 · 175 阅读 · 0 评论