- 博客(34)
- 收藏
- 关注
RSS订阅原创 echart折线图扩大点击区域并获取当前点的索引及数据
我们期望在鼠标随便点击的情况下，可以自动找到最近节点的数据，做一些事情，而不是去费力费眼的去找那个小小的折线节点点击。只有用户点击到点（对就是那个小小折线节点）的时候才能拿到返回数据或者进行下一步操作！2、在点击事件中获取索引去做一些事情。通常对echats做点击事件的时候。1、获取到当前节点的一些数据。
2023-04-18 15:29:41
2091
1
原创 vue+vuedraggable 实现表格行拖拽
尝试使用sortable效果不太好，拖拽痕迹不太明显，所以使用draggable，主要是拖拽代码。
2022-09-13 15:41:07
1345
转载 前端js正确进行加减乘除
在前端需要做浮点数的计算时，如果计算的地方很多的话，需要很精确的话，建议使用math.js这个插件库，非常好用，如果只有很少的几个计算，可以使用以下方法math.js下载：npm install mathjs --savemain.js引用并全局注册：import * as math from 'mathjs'Vue.prototype.$math = math使用：加减乘除：add,divide,multiply,subtractthis.$math.add( <!--加数--
2022-04-12 09:37:14
4056
原创 js如何从一个文件名中获取文件的类型（图片举例）
一开始直接split(’.’)，后来想文件名可能也有点点，比如nihao.ni.pnglet fileName = 'nihao.ni.png'let lastIndex = fileName.lastIndexOf('.')let type = fileName.substring(lastIndex+1) // png
2022-03-17 15:35:30
1098
原创 移动端textarea输入字符限制，输入，粘贴均可统计
工作中遇到的原生jquery写的一个问卷，textarea有一个字数限制，，在pc端用的是keyup统计的字数，可以运行，但是在手机上，统计的字数是你输入的拼音的个数，，而不是最终的你选择的中文的个数，而且复制粘贴过来的也统计不了，找了很多资料最后用的propertychange完美解决了复制粘贴的问题，keyup事件改用input事件解决统计不准问题$(`textarea`).bind('input propertychange',function(){ // code是题号 let
2022-03-15 15:18:25
1127
原创 前端各框架怎么解析html字符串
1. vuelet htmlMsg = '<p>这是一段html字符串</p>'<div v-html="htmlMsg"></div>2. 微信小程序在js中定义:msg:'<p style="color:red">红色的字</p>'在wxml中取值，使用rich-text<rich-text nodes="{{msg}}"></rich-text>另外，如果后台返回的数据中有换行符，可以通
2021-07-05 16:44:55
1293
原创 react项目使用antd组件库自定义主题颜色
我们的UI样式跟antd的颜色不太一样，所以要全局修改一下主题颜色，这是再有less的前提下，如果项目使用的不是less，请先下载less的依赖第一步：下载依赖npm install @craco/craconpm install craco-less第二步：修改package.json（一般自己就自动改了）"scripts": { "start": "craco start", "build": "craco build", "test": "craco test"
2021-06-23 15:58:00
1966
2
原创 input边框问题（原生）
有些时候，input的边框都是不需要设置的，因此，我们会给input添加border为none的样式，但是，当input获取焦点后，还是会有一个黑色的边框，这时需要设置outline为none,这样就不会再有边框的问题input{ border:none; outline:none;}...
2021-06-04 13:53:07
461
原创 下载node-sass出错，使用时报错 this.getOptions is not a function或loaderContext.getResolve is not a function
在vue项目中使用sass语法，需要下载node-sass,sass-loader，一开始是一起下的npm i node-sass sass-loader结果在使用时报错TypeError: this.getOptions is not a function,后经多方查找，把遇到的问题都记录一遍1.下载node-sass出错整个问题有多种解决办法，我用的是node-sass和sass-loader单独下载，使用的是cnpm，（如果没有cnpm，可以用下面的命令下载）注意：如果之前已经下载过一遍失
2021-05-14 14:46:07
1501
原创 pdfh5使用及不显示pdf文件原因
<!--适用于vue-->npm install pdfh5 安装<!--使用--><template> <div id="app"> <div id="demo"></div> </div></template><script> import Pdfh5 from "pdfh5"; export default { name: 'App', data() {
2021-03-27 09:43:35
4708
4
原创 iview-admin多级菜单只有一个子菜单时不显示
只要改下方法就行，目录：src/components/side-menu/mixin.jsitem.children.length > 1 改为 item.children.length > 0即可showChildren (item) { return item.children && (item.children.length > 0 || (item.meta && item.meta.showAlways))},...
2020-09-14 15:37:36
645
1
原创 vant中取消form按钮的默认提交行为
使用场景：需求中需要有一个表单，和两个按钮，vant中的按钮如果在表单内部，就会默认执行submit操作，这时如果另一个按钮想执行别的事情，那就要进行一些操作了，可以把按钮放在表单外面，然后按钮的click事件执行以下：this.$refs.checkform.submit()，这样按钮就可以执行form的submit操作了<template> <div class="result"> <van-form ref="checkfrom" alida
2020-08-26 13:56:56
3398
1
原创 在vue项目中使用vant(全局引入，按需引入，页面中引入)
安装：npm i vant -S(简写)npm install vant --save(完整写法)引入：1、全局引入main.js:import Vant from 'vant'import 'vant/lib/vant-css/index.css'Vue.use(Vant)2、按需引入（推荐）首先，安装babel-plugin-importnpm i babel-plugin-import -D(简写)npm install babel-plugin-import --save-
2020-08-26 11:22:33
11054
4
原创 js获取当前日期之后四个月的日期
使用场景：需求中是要获取到当前日期以及之后4个月的日期，类似这个月21号到下个月21号这种的，但是有几种特殊情况：这个月31号到下个月时，只有30天如果4个月之后为2月，那最后一天是28号chooseMonth () { let now = new Date() let year = now.getFullYear() let month = now.getMonth() + 5 let day = now.getDate() if (month >
2020-08-25 18:37:41
1355
原创 iview的table组件中添加单选和多选，并且点击行可以选中功能
table中添加单选，在table的列数据中添加render函数// 首先在data中定义currentid:''// 然后在table的列数据的第一列添加如下代码{ title: '选择', key: 'choose', width: 70, align: 'center', render: (h, params) => { console.log(params) let id = params.row._index;//params是一个对象，row中会有
2020-08-18 14:08:33
3658
原创 iview在table中添加select，然后select在添加必填性验证，及报错please transfer a valid prop path to form item
使用场景：table中有好几个select下拉框，比如当第一个下拉框的值选中为某一个时，后面的几个下拉框为必填，否则不必填解决方案：首先在table的最外侧用form包裹，然后哪里需要验证，就在哪个元素外面用formItem包裹，原理很简单，可是由于我的数据包裹的比较多，数据还是从上一个页面传过来的，所以就整了好长时间，主要是prop绑定的这块有问题。ps：如果你想当第一个选中那个需要的项时，后面几个立马就显示‘必填’字样，可以用iview中form API中的error属性，看下面例子就可以<
2020-08-17 14:33:48
1650
原创 前端数组循环加判断
使用场景：一个数组有两个对象，需要验证对象中的两个字段是否正确填写，否则报错，我一开始是直接写在循环中的，这样如果两条数据中都没有正确填写，那就会执行两遍报错，问了问身边的大佬，得到两个解决方案1、用for循环的方法加上break就可以for (let i = 0; i < this.detailDatas.length; i++) { console.log(i) if (this.detailDatas[i].penny && this.detailDatas[
2020-08-14 13:52:30
735
原创 created和mounted不执行的解决方法
我现在做的这个是vue多页面的项目，有一个场景是，上一个页面选中表格的数据，作为参数传递给下一个页面，每次选择不同的参数都会打开一个新的页面，第一次打开，还是执行created和mounted的，第二次或之后在打开就不执行了，所以在created和mounted中赋值时都是第一次赋的值，虽然url里是不一样的数据，奈何页面拿不到啊，解决办法：在watch方法里在赋值一遍watch: { '$route' (to, from) { console.log(this.$route.q
2020-08-13 18:18:01
2117
原创 iview中table中添加select下拉框的一些问题
使用场景：一个表格中，可能有两行以上，但每行的东西都一样，比如我这个表格中，每行的第一列都是一个下拉框，这时候绑定数据的时候就有点费劲了，你要是v-model一个固定的值，那么在你选择第一行的时候，第二行也会是你选择的那个，为了解决这个问题，也是找了不少资料，不过大部分是render函数写的，iview其实现在用slot的方式也可以解决<i-table :columns="detailColumns" :data="detailDatas"><template slot-scope="
2020-08-13 14:59:49
1497
原创 vue中路由传参刷新页面后参数丢失的问题
一般的路由传参this.$router.push({name:'My',params:{id:'123'}})this.$router.push({path:'/my',query:{id:'123'}})对于传参过后，跳转到的页面进行刷新行为，参数丢失问题，一般有下面几种方法用query传参，query类似于get传参，参数会在url中显示，例如：this.$router.push({path:'/my',query:{key: []}})接收参数：this.$route.query
2020-08-12 17:00:59
2707
1
原创 chrome浏览器手机模式下不显示鼠标
公司新发的虚拟机在chrome浏览器下F12手机模式浏览时，竟然不显示鼠标，真是第一次见，查了资料，说是设置显卡，可是我找不到显卡的位置，就又搜到了一个方法，大家可以去看，具体的我整理了一下chrome浏览器右上方三个点–设置–搜索‘硬件’–使用硬件加速模式（如果可用），关闭这个在浏览器的地址输入栏输入：chrome://restart，再刷新刚刚的页面，就可以显示鼠标了亲测有效！！！...
2020-07-09 14:56:40
2939
2
原创 无法将“git”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写，如果包括路径，请确保路径正确”
解决方法：确保安装了git(git bash)，重新添加两个环境变量，此电脑–属性–高级系统设置–环境变量–系统变量–path–编辑，添加的两个为：C:\Users\54416\AppData\Roaming\npm 和 C:\Program Files\Git\cmd，然后重启电脑，在git init，git clone 要下载的地址...
2020-07-09 13:36:37
21918
6
转载 vue+axios新手实践实现登陆
登陆流程为：1、提交登陆表单，拿到后台返回的数据2、将数据存入vuexvuex配置// store index.jsimport Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)// 初始化时用sessionStore.getItem('token'),这样子刷新页面就无需重新登录const state = { user: ...
2019-05-24 10:43:37
975
转载 Doctype作用，标准模式与兼容模式的区别
声明位于位于HTML文档中的第一行，处于 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。HTML5 为什么只需要写 ？HTML5 不基于 SGML，因此不需要对DTD进行引用...
2019-05-06 14:39:22
175
转载 markdown编辑器
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...
2019-05-06 14:38:54
86
转载 数组去重
var arr = ['abc','abcd','sss','2','d','t','2','ss','f','22','d'];//定义一个新的数组var s = [];//遍历数组for(var i = 0;i<arr.length;i++){ if(s.indexOf(arr[i]) == -1){ //判断在s数组中是否存在，不存在则push到s数组中 ...
2018-09-06 15:41:25
96
转载 基于vue的UI框架
1、饿了么 vue 2.0后台UI框架 https://github.com/ElemeFE/element 2、iview组件库 iView 主要服务于 PC 界面的中后台业务，很优秀的组件库，可惜不适合移动端 https://github.com/iview/iview https://iviewui.com/ 3、vux 基于Vue和WeUI的...
2018-09-06 11:57:47
842
原创 来理解undefined、null 和NaN区别
来理解undefined、null 和NaN区别1、null表示一个对象不存在，即，没有对象；undefined也是个对象，表示没有定义 2、null是JavaScript的一个关键字，undefined 不是关键字 3、null对应类型object，布尔值false，数字0，字符串“null”； undefined对应类型undefined，布尔型false，字符串undefi...
2018-09-05 20:25:39
730
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人