桀呐！-CSDN博客

原创 vuex存储和本地存储(localstorage、sessionstorage)的区别 _@jie

sessionStoragesessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。储存点（.）运算符sessionStorage.lastname = ‘JSAnntQ’;方括号（[ ]）运算符sessionStorage[‘lastname’] = ‘JSAnntQ’;localStorage.setItemsessionStorage.setItem(“lastname”, “JSAnntQ”);获取点（.）运算符sessi

2022-05-30 10:25:19 470

原创解决vue中编程式路由往同一地址跳转时报错的情况 _@jie

问题如下图提示：解决方法：将以下代码写到router中的index.js中// 解决编程式路由往同一地址跳转时会报错的情况const originalPush = VueRouter.prototype.pushconst originalReplace = VueRouter.prototype.replace// pushVueRouter.prototype.push = function push (location, onResolve, onReject) { if (onRe

2021-12-31 15:51:14 540 1

原创 Using / for division is deprecated and will be removed in Dart Sass 2.0.0._@jie

问题描述新写项目编译时，遇到sass语法报错，现已解决，记录一下EPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.Recommendation: math.div($px, $html-font-size)More info and automated migrator: https://sass-lang.com/d/slash-div ╷18

2021-12-31 14:27:28 1701

原创前端批量打包下载图片_个人总结 _@jie

前段时间pc端的一个需求，需要将图片打包下载到本地，于是就开始网上各种搜，折腾了几天，看了各种版本，最终自己整合后，终于实现功能。由于需求是需要打包下载，安装打包文件的插件即可，项目是基于vue的，所以需要以下两个插件支持1、安装插件 npm install jszip --save npm install flie-saver --save 2、在需要用的vue文件里引入 import JSZip from 'jszip' import FileSave

2021-12-31 11:39:42 1428 1

原创 JavaScript 中的12种循环遍历方法【总结】_@jie

本文给大家总结了12种JavaScript中的循环遍历方法,每种方法通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下1、for 循环let arr = [1,2,3];for (let i=0; i<arr.length; i++){ console.log(i,arr[i])}// 0 1// 1 2// 2 3for 循环是 Js 中最常用的一个循环工具，经常用于数组的循环遍历。2、for in 循环let obj = {name:'zho.

2021-06-03 14:02:52 468 1

原创使用 vue-router 在新窗口打开页面 _@jie

1. 使用标签实现新窗口打开：在页面导航中<router-link>被渲染为<a>标签, 在vue2版本的<router-link>支持 target="_blank" , 代码如下:<router-link target="_blank" :to="{path:'/note'}">新窗口打开</router-link>2. 编程式导航：有些时候需要在单击事件或者在函数中实现页面跳转，那么可以借助router的示例方法，通过编写代码

2021-05-29 14:07:58 274

原创 js判断字符串是否包含http _@jie

1：正则var str=new RegExp("http");str.test("httpadfsd");//test方法返回值为(true或者false)2：indexOf();var newStr=str.indexOf("http");if(newStr==0){ console.log("字符串是以http开头的！")}if(newStr==-1){ console.log("字符串不是以http开头的！")}...

2021-05-28 16:34:17 1158

原创数组转字符串join() ，字符串转数组 split()；_@jie

数组转字符串join()join() 方法用于把数组中的所有元素放入一个字符串。arr = ["get","post","put"] let string = (arr ).join('、')结果：string = "get、post、put"字符串转数组 split();split() 方法用于把一个字符串分割成字符串数组string = "get、post、put" let arr = (string ).split('、')结果：arr = ["get","post",

2021-05-12 11:21:09 230

原创 vue props 属性值接受多个类型 _@jie

labelValue: { type: String | Number | Boolean, required: true, default: 0 }

2021-05-12 10:35:16 1629

原创 element-ui复选框，选中后修改样式 _@jie

需求：复选框选中后，颜色保持正常，禁止修改①先设置好’选中且禁用’样式效果：②改变默认样式代码如下：<template> <div class="agree"> <el-checkbox v-model="checked" disabled> <span style="color: #409eff">安全账号</span> </el-checkbox> </div></template&

2021-04-16 17:05:35 1616

原创 uniapp获取当前页面路由及参数 _@jie

let routes = getCurrentPages(); // 获取当前打开过的页面路由数组let curRoute = routes[routes.length - 1].route //获取当前页面路由let curParam = routes[routes.length - 1].options; //获取路由参数// 拼接参数let param = ''for (let key in curParam) { param += '&' + key + '=' + cur

2021-04-06 15:34:56 2368

原创前端将时间格式‘2020-03-03T16:49:18.000+0000‘转化成正常格式‘2020-03-03 16:49:18‘ _@jie

直接在前端对于原来的时间格式进行工具类转化：function renderTime(date) { var dates = new Date(date).toJSON(); return new Date(+new Date(dates) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '') }转换成功为：2020-03-03 16:49:18...

2021-03-03 16:53:17 5362 2

原创修改 input checkbox(复选框) 选中的背景颜色 _@jie

在项目中遇到修改 input选中后的背景颜色实现效果如下图：代码如下：<style> input[type=checkbox] { cursor: pointer; position: relative; width: 15px; height: 15px; font-size: 14px; } input[type=

2021-02-06 14:00:05 10680 4

原创 vue和react的主要区别是什么？_@jie

Vue是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计，其核心库只关注视图层，并且非常容易学习，也易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。ReactJS是一套JavaScript Web库，由Facebook打造而成且主要用于构建高性能及响应式用户界面。React负责解决其它javascript框架所面对的一大常见难题，即对大规模数据集的处理。能够使用虚拟DOM并在发生变更时利用补丁安.

2020-09-29 19:48:47 1468

原创 vue.js封装switch开关组件 _@jie

自己封装了一个switch组件，并且实现了switch开关的双向数据绑定新建组件Switch.vue，代码如下：<template> <label role="checkbox" :class="['switch', { toggled }]"> <input type="checkbox" class="switch-input" @change="toggle" /> <div class="switch-core"

2020-09-28 20:03:58 563

原创 js判断客户端是PC还是手持设备 _@jie

1.function IsPC(){//true为pc，false为手持设备　　var userAgentInfo = navigator.userAgent;　　var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"); 　　var flag = true; 　 for (var v = 0; v < Agents.length; v++) {　　　　 i

2020-09-24 19:29:27 134 1

原创 window子对象的详细介绍 _@jie

window子对象:（1）Location 对象　　Location 对象包含有关当前 URL(统一资源定位符) 的信息。（Uniform Resource Location）Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。location.hostname 返回当前 URL 的主机名。location.pathname 返回当前 URL 的路径部分。location.protocol 返回当前 URL 的协议。location.

2020-09-23 20:22:06 1403

原创 pc端不同浏览器兼容性问题及解决方案 _@jie

代码兼容：IE7及以上，360浏览器，搜狗浏览器，谷歌，火狐，欧朋等等。一．需要注意的地方：1.写好标准头：2.首先引入初始化css,保证消除不同浏览器的细微差别。具体内容：*{margin:0;padding:0;}body{font-size:12px;line-height:25px;font-family:Arial,Helvetica,“Microsoft YaHei”,“SimSun”,sans-serif;color:#606060;background:#f6f6f6;paddi

2020-09-22 22:00:57 1598

原创 Vuex数据状态持久化 _@jie

vuex可以进行全局的状态管理，但刷新后刷新后数据会消失，这是我们不愿意看到的。怎么解决呢，我们可以结合本地存储做到数据状态持久化，也可以通过插件vuex-persistedstate。1.手动利用HTML5的本地存储方法:1、vuex的state在localStorage或sessionStorage中取值；2、在mutations中,定义的方法里对vuex的状态操作的同时对存储也做对应的操作。这样state就会和存储一起存在并且与vuex同步2.利用vuex-persistedstate

2020-09-21 19:52:21 84

原创 js三大流程控制 _@jie

1.顺序控制2.分支控制分支控制 if elsevar sex=window.prompt(“请输入性别”);if(sex==“男”){window.alert(“上男厕所”);}else if(sex==“女”){window.alert(“上女厕所”);}else if(sex==“女”){window.alert(“OK!”);//强调：一旦找到一个满足条件的入口，执行完毕后，就直接结束这个多分支。}else {window.alert(“不上厕所”);}1）

2020-09-18 22:05:24 184

原创使用element-ui实现后台的用户登录_@jie

效果：代码实现：1、首先就是页面的布局(主要是用element-ui来实现的)<template> <div class="login_box"> <div class="login_content"> <h1>用户登录</h1> <el-form :model="ruleForm" status-icon :rules="rules"

2020-09-17 22:40:51 834

原创如何使用vue-table-with-tree-grid树形表格组件 _@jie

如何使用vue-table-with-tree-grid树形表格组件1.假如遇到了一个需要搭建一个树形结构的表格页面，这时候vue-table-with-tree-grid便可以派上用场。示例如下。2.如果你是使用vue ui搭建的项目，使用时操作如下;2.1: 在vue 控制台中点击依赖->安装依赖->运行依赖->输入vue-table-with-tree-gird->点击安装 2.2:打开main.js，导入vue-table-with-tree-grid i

2020-09-16 20:24:39 907

原创 echarts中常用的一些方法(formatter) _@jie

1.自定义说明文字 lengend legend: { orient: 'vertical', right: "15%", //所处位置 top: "15%", color: ['#42bd7c', '#7fc6fa', '#1d84c7', '#20638e', '#297149', '#1ec6c6'], //设置颜色 formatter: (params) => {

2020-09-15 19:27:02 1971

原创 vue项目中使用echarts _@jie

本文包含在vue项目中如何使用echarts，以及项目中经常会遇到的图表样式的写法https://echarts.baidu.com/echarts2/doc/example.html（echart实例，包含饼状图、柱状图等等图表例子，你可以找到你所需要的图表类型）https://echarts.baidu.com/echarts2/doc/doc.html（echarts 使用文档，里面有很多属性和方法可供参考哦）1.安装echarts包npm install echarts --save或

2020-09-14 22:23:31 252

原创解决报错（Navigation cancelled from “/roleList“ to “/userlist“ with a new navigation.）_@jie

写项目的时候，报了一个错，现在总结出来，希望可以帮助到你们。这个报错的原因：使用新导航取消了从“/roleList”到“/userlist”的导航。解决的方法：关于Vue Router报错路由跳转报错问题只需要在router中的index.js中写:import Vue from ‘vue’import VueRouter from ‘vue-router’Vue.use(VueRouter)const originalPush = VueRouter.prototype.push.

2020-09-11 21:32:00 5578 1

原创 16种方法实现水平居中垂直居中 _@jie

水平居中若是行内元素, 给其父元素设置 text-align:center,即可实现行内元素水平居中.若是块级元素, 该元素设置 margin:0 auto即可.若子元素包含 float:left 属性, 为了让子元素水平居中, 则可让父元素宽度设置为fit-content,并且配合margin, 作如下设置:.parent{ width: -moz-fit-content; width: -webkit-fit-content; width:fit-co

2020-09-09 22:53:58 105

原创 vuex 面试题 _@jie

1、有哪几种属性有 5 种，分别是 state、getter、mutation、action、modulestate => 基本数据 getters => 从基本数据派生的数据 mutations => 提交更改数据的方法，同步！ actions => 像一个装饰器，包裹mutations，使之可以异步。 modules => 模块化Vuex 2、vuex 的 store 特性是什么 (1) vuex 就是一个仓库，仓库里放了很多对象。其中 state

2020-09-08 22:22:59 155

原创 Vue报错：command failed: npm install --loglevel error _@jie

Vue报错：command failed: npm install --loglevel error安装vue3.0版本时出现了问题，退出重安装后问题依然存在。解决办法：执行以下代码，清除npm缓存npm cache clean --force

2020-09-07 19:17:26 535 1

原创 const 命令_@jie

基本用法const声明一个只读的常量。一旦声明，常量的值就不能改变。const PI = 3.1415;PI // 3.1415PI = 3;// TypeError: Assignment to constant variable.上面代码表明改变常量的值会报错。const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。const foo;// SyntaxError: Missing initializer in const declar

2020-09-04 20:21:06 112

原创块级作用域_@jie

为什么需要块级作用域？ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。第一种场景，内层变量可能会覆盖外层变量。var tmp = new Date();function f() { console.log(tmp); if (false) { var tmp = 'hello world'; }}f(); // undefined上面代码的原意是，if代码块的外部使用外层的tmp变量，内部使用内层的tmp变量。但是，函数f执行后，输出结果为

2020-09-03 20:59:38 148 1

原创 let命令_@jie

let 命令基本用法ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。for循环的计数

2020-09-03 20:27:43 129

原创 Ⅰ闭包、Ⅱ原型链、Ⅲjs继承_@jie

Ⅰ、闭包闭包是由什么构成？闭包 = 函数 + 词法作用域词法作用域：即以变量声明定义的位置为参照，如果当前位置没有定义，就会访问父级定义的位置广义上闭包：var a=1000;function fn1() { alert(a)}fn1()平时工作中用到的闭包狭义上闭包：1.函数内嵌套函数；2.子级函数引用了父级函数的相关变量；狭义上闭包应用场景和实现：//求和function makeAdd(x) { return function(y) { ret

2020-09-02 20:33:26 99

原创可用于优化 CSS 图片加载的常见技术_@jie

CSSSprite 减少对服务器请求SVGSprite 体积小，矢量Iconfont 体积小，矢量，集成度高Base64 减少对服务器请求

2020-09-01 19:37:34 654

原创 ①call,apply,bind；②new的特点；③防抖和节流_@jie

一、call,apply,bindcall,apply,bind都是用于改变this指向的区别：传参不同call用逗号分隔的形式传参函数名.call(目标对象,参数1,参数2,...参数n)例如：getName.call(obj,'王五',25,'北京')apply参数用数组的形式传递函数名.apply(目标对象,[参数1,参数2,...参数n])例如：getName.apply(obj,['王五11',25,'上海'])bind用逗号形式传参getNam

2020-08-31 22:32:02 84

原创细说数组常用遍历的方法_@jie

前言本文主要介绍数组常见遍历方法：forEach、map、filter、find、every、some、reduce，它们有个共同点：不会改变原始数组。一、forEach：遍历数组var colors = ["red","blue","green"];// ES5遍历数组方法for(var i = 0; i < colors.length; i++){ console.log(colors[i]);//red blue green}// ES6 forEachcolors...

2020-08-28 23:18:41 179

原创 JS数据类型（8种）_基础篇_@jie

JS数据类型：基础概念请注意：JS的数据类型有8种。在ES5的时候，我们认知的数据类型确实是 6种：Number、String、Boolean、undefined、object、Null。ES6 中新增了一种 Symbol 。这种类型的对象永不相等，即始创建的时候传入相同的值，可以解决属性名冲突的问题，做为标记。谷歌67版本中还出现了一种 bigInt。是指安全存储、操作大整数。（但是很多人不把这个做为一个类型）。JS数据类型：JS 的数据类型有几种？8种。Number、String、Bool

2020-08-27 21:03:44 372

原创 vue 中递归组件的用法_@jie

概念：组件是可以在自己的模板中调用自身的，不过他们只能通过name选项来做这件事。使用vue框架，我们会发现export default 导出的对象中有一个name属性，这个name属性是一个比较重要的属性，而且属性好处不止这一处。用法：1.首先我们要知道，既然是递归组件，那么一定要有一个结束的条件，否则就会使用组件循环引用，最终出现 “max stack size exceeded”的错误，也就是栈溢出，那么我们可以用v-if=false作为递归条件的结束，当遇到v-if为false时，组件将不

2020-08-26 23:09:32 672

空空如也

空空如也