前端
益达木咸醇
0 error(s), 0 warning(s)!
展开
-
本地vite启动的vue项目使用nginx代理
代理本地服务原创 2024-05-12 17:40:00 · 416 阅读 · 3 评论 -
vue3+Ts使用pinia(vue-lic搭建项目)
vue3+ts+pinia原创 2022-07-14 15:50:01 · 1461 阅读 · 0 评论 -
vue中给package.json配置开发、测试、生产环境
1、用vue-cli脚手架搭建的项目初始化后应该是这样的(这里只分享脚手架搭建后的项目,):原创 2022-05-25 20:12:42 · 2007 阅读 · 2 评论 -
vue全局注册一个文件夹下所有的组件
vue全局注册某文件夹下的所有组件原创 2022-05-24 19:59:35 · 715 阅读 · 0 评论 -
vue3从父组件将标签属性(class、id等)传给子组件中的指定的标签
html、vue、属性传值原创 2022-05-14 17:38:10 · 1972 阅读 · 0 评论 -
用element-plus+vue3+ts实现搜索下拉框
element_plus+vue3+ts原创 2022-05-11 15:48:52 · 3367 阅读 · 3 评论 -
vue结合elementui制作上传文件组件
<template> <div class="upLoad-box"> <div class="file"> <div class="textBox" v-show="uploadName"> <i class="fileIcon"></i> <span class="fileTitle">{{uploadName}}</span> <i class="uploadClo原创 2021-09-07 20:58:11 · 174 阅读 · 0 评论 -
v-for便利对象
<div v-for="(val,key,index) in obj" :key="index> <div>{{ val }}:值</div> <div>{{ key }}:键值</div> <div>{{ index }}: 下标</div></div><script>var vm = new Vue({ data : { obj: { name : '邹', age原创 2021-09-07 19:47:56 · 171 阅读 · 0 评论 -
vue结合elementui实现ip输入框
不多说直接上代码:<template> <div class="ip-box"> <el-input v-model="ip1" name="ip" maxlength="3" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.native="keyupEvent(1,$event)" @blur="submitIp" @input="(val) => checkVal(val,'ip1')" ref="ip1"&原创 2021-09-02 21:00:34 · 3246 阅读 · 1 评论 -
elementui表格默认选中
重点:一般地,我们是用接口返回的数据去渲染elementui的Table表格,而这里如果要实现默认选中的效果,就必须要有一下的条件:1、一定要接口返回数据之后才进行默认选中的操作,即用this.$nextTick(function() {...}),在里面进行默认选中的操作;2、一定要用el-table标签里面的data属性的那个数组去用forEach循环体(试过用for循环不行)中用this.$refs.****.toggleRowSelection(row,true);实现默认选中不多说原创 2021-08-21 16:54:37 · 2209 阅读 · 0 评论 -
阻止鼠标后退键后退页面
声明:此中阻止页面后退的方式适用于Vue.js单页面中,某个页面当作两个页面用(类似于,触发(点击)了某个操作,让页面隐藏了以前的内容,显示现在的内容)下面不多说直接上代码:mounted () { let currentUrl = window.location.href; history.pushState(null,null,document.URL); window.addEventListener("popstate",function (e) { })}...原创 2021-08-21 15:34:44 · 311 阅读 · 0 评论 -
vue可以将标签的属性用methods的方法返回值表示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ele原创 2021-07-26 20:29:38 · 1486 阅读 · 0 评论 -
elementui树形控件懒加载
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ele原创 2021-07-26 20:12:07 · 1041 阅读 · 2 评论 -
elementui表格自定义筛选功能
1、子组件方式1:用调接口的方式去筛选数据<el-popoverv-model="isShowFilter" placement="right" width="400" trigger="click"> <el-checkbox-group v-model="filterResVal"> <el-checkbox :label="item.label" v-for="(item,index) in filterCondition" :key="in原创 2021-07-23 17:03:19 · 2406 阅读 · 0 评论 -
elementui半选状态下获取父节点
1、如果只是获取勾选的节点那么用:tree为dom上ref对应的值this.$refs.tree.getCheckedNodes()但是以上的方式无法获取选项的父节点2、获取勾选的所有关联节点(所有的半选节点也一并获取):tree为dom上ref对应的值this.$refs.tree.getCheckedNodes(false,true)使用2的方式应该是需要elementui的一定版本,低版本的可能不行,这里提示一下...原创 2021-07-23 14:55:42 · 396 阅读 · 0 评论 -
v-model可以是v-for循环数组的数据
需求场景前端框架是vue.js,并且需要用后端返回的数据内的某个字段值去渲染初始值,如输入框的默认值或者是多选框是否要默认勾选等等,最后还需要将页面设置的值传回给后端示例如在data中定义了一个:checkBoxList:[],然后我请求完成后,赋值给checkBoxList,假如checkBoxList的结构如下:checkBoxList: [ { name: 'xxxx', value: true }, { name: 'xxxx', value: false },原创 2021-07-18 12:48:00 · 902 阅读 · 1 评论 -
Vue中封装axios模块
导语安装axios:npm install --save-dev axios (–save-dev是开发环境和生产环境都安装)备注:在工程项目的目录下新建js文件,如ajax.js代码如下/** * @file axios工具类 * */import axios from 'axios'; import Vue from 'vue';const serviceBaseUrl = 'http://10.20.30.44:8080'; //默认请求地址let addR原创 2021-07-16 20:53:11 · 241 阅读 · 0 评论 -
左侧文章目录菜单栏的实现(Vue)
实现效果示例图:点击到每个目录就会跳到那个目录的标题处(这里使用的是瞄点定位)1、准备代码示例:<div class="title-nav"> <div class="box-line"> <img class="gif" src="/img/summit/home/nav.gif" alt="" /> <img class="line" src="/img/summit/ho原创 2021-06-07 15:53:50 · 1305 阅读 · 0 评论 -
vue中使用echarts结合百度地图制作地图(引入百度地图、获取百度地图实例、设置百度地图)
1、初始化echarts以及例子可以看管网的地址:https://echarts.apache.org/examples/zh/editor.html?c=map-polygon2说下我遇到的问题:1、按照官方的例子写下来的,但是地图就是出不来2、除了官方例子中的元素外,还需要给百度地图添加中心点、定位等等,但是不知道怎么获取百度地图实例3、获取到百度地图实例后设置百度地图的元素不生效(1)、引入百度地图AK在项目的文件夹中(看具体项目在哪里新建都行)新建一个js文件,文件内容如下: //百原创 2021-05-06 11:26:07 · 3373 阅读 · 0 评论 -
vue在mounted生命周期用document.getElementById获取input标签显示null
原因:input标签的父标签(不管有几层)含有v-if或者v-else指令解决方法:去掉v-if或者v-else指令,调整html标签,即可原创 2021-05-06 10:46:22 · 2352 阅读 · 0 评论 -
npm run build打包时提示RangeError:Maximum call stack size exceeded
项目打包时提示如下:UnhandlePromiseRejectionWarning:RangeError:Maximum call stack size exceededat match (…/vue-router.common.js)at redirect (…/vue-router.common.js)at _createRoute (…/vue-router.common.js)…UnhandlePromiseRejectionWarning:Unhandled promise rejec原创 2020-10-19 22:30:48 · 1879 阅读 · 2 评论 -
video实现控制视频进度和播放、暂停
<!-- 视频控制组件 --><template> <!-- 父组件上请用.playControll的display实现hover,show-controll支持的是一直显示的情景 --> <div :class="['playControll',ctrlObj.isShow?'show-controll':'']"> <div :class="['play-pause', isPlay?'pause-icon':'pl原创 2020-10-07 12:39:14 · 3016 阅读 · 0 评论 -
git pull提示Please make sure you have the correct access rights and the repository exists
执行命令git pull结果:原因:执行git remote -v 查看git地址采用了ssh方式:切换为https方式即可,步骤:首先要找到https方式的地址,如下图:然后回到git命令界面执行:$ git remote add origin https://github.com/XXXX/lagou.git出现了:fatal: remote origin already exists.因为我之前设置了ssh方式,这里使用命令:$ git remote rm origi原创 2020-08-11 15:53:20 · 761 阅读 · 0 评论 -
关于前端做项目的一些想法
引言今天去一家公司面试,面试我的是技术团队的技术总监,关于在面试的时候他对我问的几个问题引起了我的深刻思考。1、你觉得你在过去一年的工作时间里你觉得你最大的收获是什么?老实说,当我听到这个问题的时候,我当时是懵逼的,算上刚开始又过了一遍HTML、CSS、JS的时候,我总共来到前端也就是4个月不到,我只做了两个项目,还是那种不完整的项目,一个是拉勾招聘网、另外一个是移动端的喵喵电影网,我当时的回答是对一种框架的应用,从学习了,然后开始使用框架到实际项目中,只不过我处于刚使用的阶段。关于这个问题,我仔细想原创 2020-07-27 20:12:09 · 820 阅读 · 0 评论 -
获取当前年月和之前的11个月份
不多说直接上代码:function getLast12Months() { var last12Months = []; var today = new Date(); var year = today.getFullYear(); today.setMonth(today.getMonth()); for (var i = 0; i < 12; i++) { last12Months[11 - i] = today.getFullYear() +原创 2020-07-20 09:40:21 · 700 阅读 · 0 评论 -
关于最近面试总结
前言自学web前端已经有3个月了,三个月里也有疯狂的玩,也有学到深夜的时候,也是之前做ERP实施顾问的时候业余时间就学了HTML、CSS、JS,后来辞职之后就选择了入web前端这一行,刚开始的时候也遇到过培训机构让我去他们那里培训的,但因为条件不好还有就是可能就是觉得自己可以自学(也许和大学的专业有关,大学学的是计算机科学与技术),在这里还是要说说,不是热爱编程这一块的人,只是为了赚钱的话,不建议转行,像一些前辈说的,如果工作只是工作,没有乐趣,那么时间长了,会感到无聊和无趣,我是在做前一份工作的时候,深原创 2020-07-05 13:24:29 · 227 阅读 · 0 评论 -
执行git命令提示![rejected]pcdev-pcdev(none-fast-forword)error:failed to push some refs to
记录昨天到现在为止踩到的坑。昨天带着尝试的态度用git pull…命令来将远程仓库的代码更新到本地,然后出现了一系列的问题,导致我昨天晚上一直用:git push -u origin pcdev命令怎么都提交不上去代码,一气之下放弃了,去打了游戏(主要是太蛋疼了,搜索了一大堆的问题,从下午到晚上,一直卡在这里,心态崩了),今天一起来又尝试git push -u origin pcdev,提示如下:在这里要说下,昨晚我在睡之前其实是提示了无法从140.82.112.4的22端口接入(记忆力就这么个水平了原创 2020-06-21 12:34:48 · 294 阅读 · 0 评论 -
window系统下使用nvm安装后node生效但是npm不生效
问题:使用nvm安装nodeJS之后,node -v命令可以正常使用,但是使用有关npm的命令就会提示如图:分析:首先要确保你的nvm执行没有问题,比如,查看nvm中你安装的node版本,命令:nvm list使用node的版本,通过命令:nvm use 版本号,这里用10.20.1示范:然后接着查看node的版本,通过命令:node -v如果出现类似这样的提示:node : 无法将“node”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,原创 2020-06-13 01:11:10 · 3072 阅读 · 2 评论 -
设置浮动无法浮动到上一个div的上面
今天又踩了一个坑,是我忘记了float样式的原本的效果了【哭】。来看下代码:html代码:<body> <div class="box1"></div> <div class="box2">设置浮动只会影响后面元素的布局</div> <div class="box3"></div></body>css代码: .box1{ width: 2原创 2020-06-11 11:30:03 · 1663 阅读 · 1 评论 -
关于IE6浏览器出现的问题的解决
关于IE6浏览器出现的问题的解决1、IE6双边距问题:html代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edg原创 2020-06-03 00:29:03 · 192 阅读 · 0 评论 -
用axios获取数据后无法显示数据在列表中
TO用axios获取数据后无法显示数据在列表中html代码:json代码:以上的代码的效果图如下图:再看看下面的图:到这里我之前就很迷,为什么这里明明获取了数据了,但是li节点就是不显示出来呢,问题就在这个this上面:我犯了一个错误,就是以为这里的this是直接指向vm对象的,但是实际上这里并不是,当我加上下面的代码:console.log(this)答应出来这里却是...原创 2020-04-25 19:39:15 · 2340 阅读 · 4 评论