Gabriel.c-CSDN博客

原创 js-cookie 关于js-cookie 什么是js-cookie js-cookie的使用

js-cookie是什么？js-cookie是一个简单的,轻量级的处理cookies的js API，用来处理cookie相关的插件js-cookie的使用方法一、先下载npm install --save js-cookie**二、引入安装好js-cookie插件后，在我们需要处理cookie的地方，简单的通过import引入就可以使用了import Cookies from 'js-cookie'三、js-cookie的添加获取删除添加cookie// 创建一个名称为name，

2021-11-03 15:53:09 40114 2

原创 element-ui el-tree 文本超出显示省略号添加移入提示

element-ui el-tree 文本超出显示省略号添加移入提示

2023-11-15 09:00:00 760

原创 echarts 图表文字大小自适应字体大小自适应

echarts 图表文字大小自适应字体大小自适应

2023-11-14 14:24:28 597

原创 js截取字符串中间部分用其它字符代替 substring截取 replace替换

js截取字符串将字符串中间部分替换成其他字符

2022-08-31 16:51:06 829 1

原创 vuex的使用 vuex详解 vuex刷新数据丢失？vuex数据持久化-解决刷新数据消失的问题看这一篇就够了

什么是vuexvuex是一个程序里面的状态管理模式，它是集中式存储所有组件的状态的小仓库，并且保持我们存储的状态以一种可以预测的方式发生变化。那么什么情况下使用vuex呢如果数据还有其他组件复用，建议使用vuex如果需要跨多级组件传递数据，建议使用vuex需要持久化的数据（如登录后用户的信息），建议使用vuexvuex的使用在src路径下创建store文件夹，然后创建index.js文件，文件内容如下：import Vue from 'vue';import Vuex from 'vuex

2022-04-12 14:07:34 2220 2

原创 a标签的妙用快速调用移动设备的电话/短信/邮件三大通讯功能＜input＞快速调用移动设备的的图库

这些功能方便了页面与系统的交互，关键在于调用格式一定要准确,只需使用标签即可<a href="tel:xxxx">拨打电话给xxxx</a><a href="sms:xxxxx">发送短信给xxxxx</a><a href="[email protected]">发送邮件给[email protected]</a><!-- 选

2022-03-29 15:28:31 643

原创 js精准的判断数据类型 js判断数据类型 Object.prototype.toString.call为什么要调用call

如何精准的判断数据类型呢？使用 Object.prototype.toString.call 方法typeof 和 instanceof 的弊端typeof 可以判断除了 null 以外的基本数据类型，但是判断引用类型时，除了 function 类型，其他的无法准确判断。instanceof 可以准确地判断各种引用数据类型，但是不能正确判断基本数据类型。Object.prototype.toString.call//基本数据类型Object.prototype.toString.call(0)

2022-03-22 15:12:46 747 1

原创根据对象数组中对象的某个属性，取出属性值，组成新的数组

// 定义空数组 var arr=[] //对象数组 var data=[ {id:1,name:"张1"}, {id:2,name:"张2"}, {id:3,name:"张3"}, {id:4,name:"张4"} ] //遍历对象数组某个属性的所有属性值，添加到新数组 for(let item of data){ //name arr.push(item.name) } console...

2022-03-09 10:11:04 1516

原创对象数组根据对象的某个属性排序

对象数组var data = [ { id: 1, age: 12, name: "张1" }, { id: 2, age: 1, name: "张2" }, { id: 3, age: 2, name: "张3" }, { id: 4, age: 3, name: "张4" }, ];根据某个属性排序的方法 function sortObj(property){ return function(obj1,obj2){ var data1=obj1[prop

2022-03-09 10:05:19 381

原创 localStorage如何存储对象，数组 sessionStorage如何存储对象为什么存储后却显示 [object,object]

localStorage 和 sessionStorage 基本用法基本一致；localStorage需要会长时间保存，而sessionStorage会保存在当前对话框，会随着浏览器的关闭而被清除，存储的数据格式必须是string；所以当localStorage.setItem（a,b）时，不管b为何种数据，在存储时都会被强制转化为string格式，进而在拿取getItem(a)时得到的永远是字符串，存储：localStorage.setItem('obj', JSON.stringify(对象))

2022-02-22 15:46:45 1105

原创前端截取某个特定字符之前或者之后的字符串 substring

var str =“aaa,bbb”//截取","之前字符串var str1=str.substring(0, str.indexOf(","));console.log(str1) //aaa//截取","之后字符串vra str2=str.substring(str1.length+1, str.length);console.log(str2) //bbb

2022-02-16 10:04:25 4310

原创获取地址栏参数采用正则表达式获取地址栏参数

采用正则表达式获取地址栏参数方法：function GetQueryString(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r!=null)return unescape(r[2]); return null;}// 调用方法***切记参数名要带引号

2022-02-14 14:25:03 376

原创 vue启动项目后上滑发现有报错但不影响启动项目报错 error ‘xx‘ is defined but never used no-unused-vars ”eslint“

出现这个错误的意思是你定义了变量但是不使用由于eslint校验运行的时候就会报错。解决方法找到未使用到定义的变量的上一行添加下面这句话// eslint-disable-next-line或者<-- eslint-disable-next-line -->...

2022-01-06 10:36:56 1070

原创启动项目报错 import “core-js/modules/es6.regexp.constructor“ vue项目

这种情况是项目少了文件是少了.env.development 和 .eslintrc.js 这两个根目录下新建.env.development 文件内容是：VUE_CLI_BABEL_TRANSPILE_MODULES = true然后全局安装 ESLintnpm install eslint --save-dev根目录下新建文件 .eslintrc.js 内容：module.exports = { "env": { "browser": true,

2021-12-29 13:34:43 951

原创 git操作 git提交步骤使用vs code提交代码

如何使用vscode提交代码首先桌面新建文件夹右击git bash,然后git clone 地址将项目克隆下来然后将项目拉到vscode中点击左下角切换分支如果文件被改动左侧就会出现提示每次提交代码前都要拉取一下切记！！！！现在提交这个文件先点这个＋号将文件添加到暂存区然后点击提交点击完提交会弹出在这里面写入要添加的描述回车即可最后一步点击推送即可完成提交...

2021-12-23 17:57:54 463

原创项目中的按钮颜色与element ui中的颜色不一致被其他框架覆盖引入方式不一样 vue项目

在项目中给button设置了type=wraning在项目中的颜色：在element ui中的颜色：明显不是一个颜色首先先看是不是被其他框架的样式覆盖了比如说vuetify,详细看这篇文章：https://juejin.cn/post/6897775896561156104如果不是被其他框架样式覆盖接下来看main.js中是如何引入element ui的一般项目都是引入这两个import ElementUI from 'element-ui';import 'element-ui

2021-12-21 10:48:24 793

原创 element ui点击空白处不关闭弹框 el-dialog

el-dialog默认点击空白处也会关闭弹框它本身自带这样一个功能“:close-on-click-modal”想要关闭这个功能只需要在标签上加这个属性就可以了<el-dialog title="弹框" :visible.sync="dialogFormVisible" :close-on-click-modal="false"></el-dialog>...

2021-12-17 17:41:44 479

原创 el-input输入框无法输入输入框无法输入 input无法输入问题

输入框输入不了是因为组件嵌套了层级导致组件不能及时刷新解决办法是给input输入框添加input事件强制刷新<el-input @input="forceUpdate" v-model="data" placeholder="请输入"></el-input>methods中forceUpdate() { this.$forceUpdate() }...

2021-12-14 13:10:16 1446

原创 vue+element-ui 登录界面浏览器自动填充保存的用户名和密码问题后台管理系统如何取消浏览器自动填充

网上一搜如何取消密码自动填充这个问题大多都是给el-input加auto-complete这个属性但这个属性某些情况下还是会出现自动填充问题会很麻烦不能解决问题这个时候可以使用input密文显示将原本type=“password” 改成type=“text”然后设置css样式el-input{-webkit-text-security：指定要使用的形状来代替文字的显示none 无。circle 圆圈。disc 圆形。square 正方形}这时就解决了账号密码自动填充..

2021-12-13 15:51:46 2844 1

原创 echart图表自适应单个图表以及多个图表

单个图表自适应window.onresize = myChart.resize;多个图表自适应window.onresize = function () {myChart.resize();myChart2.resize();}window.addEventListener(“resize”, () => {this.myChart.resize();this.myChart2.resize();});还有一种自适应的方法就是给图表定位position:absolute;l

2021-12-13 13:44:29 295

原创 element-ui中dialog弹框关闭点击弹窗右上角叉号或者点击空白处关闭

解决方案：这是一个弹框给它加一个:before-close=“ai_dialog_close” <el-dialog title="" :visible.sync="dialogTableVisible" :before-close="ai_dialog_close"> <el-tree :data="gridData" show-checkbox default-expand-all

2021-10-20 14:18:06 4733

原创微信小程序选项卡点击导航内容切换滑动内容导航切换

index.wxml: <view class="swiper-tab"> <view class="swiper-tab-list {{currentTab==0 ? 'on' : ''}}" data-current="0" bindtap="swichNav">导航1</view> <view class="swiper-tab-list {{currentTab==1 ? 'on' : ''}}" d

2021-10-20 09:11:16 484

原创 vue项目编译打包打包项目

一、在终端npm run buildnpm install -g serveserve dist二、在vs code中>NPM脚本运行build即可（建议使用）打包完成后项目会生成一个dist文件夹

2021-10-19 15:43:58 1249 3

原创 vue项目报 “error Empty block statement no-empty“ 不规则空格引起报错解决方案

一、在 package.json中添加{ "name": "system", "version": "0.1.0", "private": true, "eslintConfig": { "plugins": ["example"], "env": { "example/custom": true } },}二、在项目根目录添加独立的配置文件.eslintrc.js 内容如下：module.exports = { root: t

2021-10-19 15:28:13 2139

原创 vue 在.js文件中进行路由跳转

我们在.vue文件中js跳转路由是this.$router.push("/")在.js文件中，只需要先引入router 然后 router.push("/") 进行跳转import router from’…/router’router.push(’/’);

2021-10-10 15:22:55 3458

原创如何使用vis.js动态可视化库 vis.js的使用

network实例请参考官网：http://visjs.org/network_examples.htmlvis.js是什么？vis.js 基于浏览器的动态可视化库。该库被设计为易于使用，处理大量的动态数据，并支持对数据的操作和交互。该库由组件DataSet，Timeline，Network，Graph2d和Graph3d组成。这里主要用到Network（网状图）network是一种可视化的网络和网络组成的nodes节点和edges边缘。可视化易于使用，并支持自定义形状、样式、颜色、大小、图像等。网络

2021-09-24 10:21:39 1189

原创前端命名规范命名规范类名规范

一、普通变量的命名1.采用小驼峰式命名法则，即第一个单词字母小写，其余单词首字母大写2.命名相关3.复数 + s二、常量首字母大写，多个单词用“_”连接，例如：Box_Content三、css类名规范1.命名相关2.单词均小写，多个单词用“-”连接，例如：box-content...

2021-09-22 15:54:26 635

原创 hash和history两种模式的区别

前端路由 vue-router 有两种模式 ,hash模式和history区别一、hash 就是指 url 尾巴后的 # 号以及后面的字符，history没有底带#，外观上比hash 模式好看些二、原理的区别（原理）三、hash 能兼容到IE8， history 只能兼容到 IE10四、由于 hash 值变化不会导致浏览器向服务器发出请求，而且 hash 改变会触发 hashchange 事件（hashchange只能改变 # 后面的url片段）；虽然hash路径出现在URL中，但是不会出现在H.

2021-09-03 09:47:46 3998

————————————————————————————————