head-img Sihan's Blog

分类 JavaScript 下的文章

js 对象截取前几对key-value
期望将如下对象截取前3对key-value ``` var obj = { apple: 124, banana: 23, melon: 19, pear: 100, orange: 68 }; ``` 函数 ``` intercept(o ...
js 对象依据value排序
希望将如下对象依据value进行排序,并且保持key与value对应 ``` let obj = {ATTACK: 698462, AV: 4174, FILTER: 7589767, IPS: 1106719, SCAN: 1667425 ...
vue 实现千位数逗号分隔符方法
需求需要实现例如将 `23012` 显示为 `23,012` 1.创建转换方法`addThousand` ```vue methods: { addThousand: num => num.toLocaleString(), } ``` 2 ...
elementUI 定制按钮主题
### 1.引入全局样式文件 首先在vue入口文件全局引入一个样式文件`global.less`,这里以less文件举例(sass、css...都可) 注意**不要**在` `添加作用域限制指令`scoped` ```Vue export ...
vue 路由切换前关闭api pending请求
现象: 最近访问前端页面发现一个问题,在回退页面的时候,点得很快,就会突然跳到一个其他页面,如:访问时候顺序是:A–>B–>C–D,回退的时候,本应该是:D–>C–>A,但是你不耐烦就点得很快,回退跳转实际是:D–>C–>A–>C。 原因: ...
Javascript new Date() safari Invalid Date 引发的思考
前言:笔者近期使用`new Date()`将日期格式转换时间对象在safari下报错Invalid Date引发的思考 项目中涉及将`2022-08-01 00:00:00`日期格式转换为CST时间(本文中CST实现显示为英文是因为笔者系统 ...
Vue3实现一个简单的路由
如果你只需要一个简单的页面路由,而不想为此引入一整个路由库,你可以通过动态组件的方式,监听浏览器 hashchange 事件或使用 History API 来更新当前组件。 下面是一个简单的例子: ``` import Home from ...
Vue关闭控制台[Vue warn]
找到 xxx/src/main.js文件, new Vue()前面找个位置添加: ```javascript Vue.config.silent = true; ```
Nodejs快速更换国内源
```shell npm config set registry https://registry.npm.taobao.org && npm config get registry ```
正则验证集合
Domain ``` /^(([0-9a-zA-Z]+)|([0-9a-zA-Z]+[_.0-9a-zA-Z-]*[0-9a-zA-Z]+))(([a-zA-Z0-9-]+[.])+([a-zA-Z]{2}|net|NET|com|COM| ...
vue中监听路由参数的变化
在vue项目中,假使我们在同一个路由下,只是改变路由后面的参数值,期望达到数据的更新。 ``` mounted: () =>{ this.id = this.$route.query.id; this.getdetail() } ``` g ...
Vue使用Array.prototype.push.apply导致视图不刷新问题解决
vue移动端列表项目中使用`searchFormData`作为列表对象,追加数据使用`Array.prototype.push.apply`。 接口返回数据后视图不刷新,查阅资料后是因为vue数组更新检测包含一组观察数组的变异方法,所以它们 ...
Vuex刷新后保持state
利用`sessionStorage`配合保存状态,刷新前`sessionStorage`赋值给state。 ``` export default { name: "app", components: {}, created() { // 页 ...
javascript 二进制转字符串
``` function binaryAgent(str) { var splitStr = str.split(" "); var newVar = splitStr.map(function(val) { return String.f ...
vue如何动态绑定多个class
给一个dom绑定多个class,而且是动态绑定,代码如下: ``` // classA 是固定不变的,classB与classC 是根据条件来判断是否加入 ``` 转载自:https://www.jianshu.com/p/e4248eb7 ...
vue 实现的四级密码强度检测功能示例
这篇文章主要介绍了JS实现的四级密码强度检测功能,具有实时检测输入密码强度的功能,涉及javascript针对字符串的正则判定相关操作技巧,需要的朋友可以参考下 Dom部分 ``` 密码 弱 中 强 很强 ``` Vue部分 ``` dat ...
vue监听滚动事件DEMO
vue中监听滚动事件,然后对其进行事件处理,一般有:1. 滚动到顶部吸附; 2. 根据滚动的位置激活对应的tab键(锚链接tab键) 这两种方式的处理都是可通过监听scroll来实现 ``` mounted(){ window.addEve ...
element-ui steps 加点击事件无效解决办法
添加@click 添加之后发现不好使 找了一番资料发现得这样写就可以了@click.native 这个native是什么作用呢? 查了一番资料大概就是vue封装@click这些方法时阻止了原生的DOM事件,而native就是释放DOM原生事 ...
js控制浏览器全屏
**全屏显示** ``` var docElm = document.documentElement; //W3C if (docElm.requestFullscreen) { docElm.requestFullscreen(); } ...
vue form表单上传文件
> 本文章向大家介绍vue form表单上传文件,主要包括vue > form表单上传文件使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。 ``` ``` 单独上传文件: ``` ``` ``` ...
vue 中 选择元素 模拟点击事件
``` 放大图片 ``` ref="carImg" 设置元素名称 后面可以选择 js中选择方式: this.$refs.carImg js 模拟点击: el.click() 在vue的@clike里: $refs.carImg.click( ...
Vue 项目防止用户手动修改本地存储sessionStorage
最近考虑到项目安全,需要限制用户私自修改sessionStorage本地存储。 查阅资料后简单来说就是需要在main.js中添加代码如下 ``` //防止手动修改本地存储 window.addEventListener('storage', ...
Element UI 表格换页渲染闪烁问题解决
使用Element UI自带的分页组件异步请求API数据后发现翻页时候总会闪烁一下,特别影响体验。 问题代码参考如下: ``` handleCurrentChangeForum(page) { //清理翻页前数据 this.forum_in ...
vue element-ui 表格列元素添加链接
如果要给表格列添加链接,则需要使用自定义列模板(针对element),通过 scoped slot 可以获取到 row, column, $index 和 store(table 内部的状态管理)的数据。关于自定义列模板,在https:// ...
vue 子组件修改data或调用方法
``` ``` 父组件: ``` this.refs.xxx.子组件定义的方法() ``` 外部: ``` vm.$refs.xxx.子组件定义的方法() ``` 注意:子组件添加 ref 属性,父组件才可以通过 refs 获取. 转载自: ...
js 页面平滑滚动到页面顶部
``` //回到顶部 const scrollToTop = () => { const fromTopDistance = document.documentElement.scrollTop || document.body.scrol ...
ElmentUI el-input__inner样式无法修改问题
在Vue中,style要求scoped,只修改本组件下的样式,使用>>>和/deep/来选择子组件 记录一下自己在需要table中使用input,而不出现边框,显然是border: 0;就可以的 使用了各种 .el-input .el-in ...
vue页面之间相互传值的方法
1、使用query传值--地址栏可见 比如从a.vue跳转至b.vue,传name=‘jack’,代码如下: ``` this.$router.push({ path: "/result", query: { name: 'jack' } ...
vue-resource emulateJSON的作用
如果Web服务器无法处理编码为application/json的请求,你可以启用emulateJSON选项。 启用该选项后,请求会以application/x-www-form-urlencoded作为MIME type,就像普通的HTML ...
Module build failed: Error: No PostCSS Config found
使用vue框架写pc页面时,我们经常会用到element-ui这个框架。 当我们吧把需要的东西都装在好运行项目的时候,有时会出现这样的错误, ![2018060920404578.png][1] 这是因为缺少了一个配置文件,postcss. ...
关于vue-router嵌套路由,默认子路由方法设置
我们在做项目的时,常常会遇到使用Tab切换页面需求,要求设置第一个选项卡为默认选项。这时候我们就需要用到 vue-router 嵌套路由实现。设置默认项使用 redirect 属性即可。 ``` export default new Rou ...
PHP与Javascript语法快速对照攻略
``` php的基本类型分别: 1.基本数据类型:整型、小数(float/double)、字符串、布尔类型 2.复合类型:数组、对象 3.特殊类型:Null,资源类型 JavaScript的基本类型: Undefined,Null,Bool ...