- 博客(19)
- 收藏
- 关注
RSS订阅原创 js中对象获取属性的两种表示方法
一 使用 .点 一般操作静态对象来存取属性 mounted(){ let obj = { a:"m1", b:"m2" } console.log("a---",obj.a)//m1 }我们平常开发中会多使用第一种方式，系统会把调用的obj.a自动隐式转换成 ：obj[‘a’]来执行，所以第二种会比第一种快捷。二 使用 [] （又称数组表示法）中括号 一般操作动态对象来存取属性 mounted(){ let obj =
2021-10-20 11:20:53
876
原创 Vuejs自定义指令实现移动端和pc端的div随意拖拽。
在Vue里提倡操作虚拟dom尽量不操作真实是dom。但在频繁操作dom的情况下显然体验不好，使用Js操作真实dom来实现div的随意拖拽。这里为了复用，写成了指令，方便其他页面使用，直接调指令，不需要重复写。pc端：<template> <div class="ha"> <div class="box" v-wahaha></div> </div></template><script>expor
2021-09-17 17:11:19
901
原创 nextTick的使用
一 为什么用nextTickvue中的Dom更新是异步的，是异步的意味着当被处理数据是动态变化时，此时对应的Dom未能及时更新（同步更新）就会导致数据已经更新（model层已经更新）而视力层未更新（Dom未更新）此时就需要使用nextTick了。当你想要拿到更新后的Dom，一定要在nextTic的回调函数中去获取更新后的Dom的值。如`this.$nextTick(()=>{})结构：this.$nextTick(()=>{ 在这里获取dom更新后的值})注意：在下次Dom更
2021-07-01 21:47:42
6660
1
原创 async/await的使用
async的作用：顾名思义async字面意思是“异步”的简写，async用于定义一个异步的函数（被定义的函数是异步的函数）async申明的异步函数，返回值一定是一个promise对象，假如异步函数里返回的不是promise对象而是一个常量或者其他值，也会被自动用promise.resolve(x)封装成一个promise对象返回出去，而x表示被返回出去的值。promise.resolve(x)等价于new Promise(resolve=>resolve(x))的简写。如async func
2021-06-02 00:43:20
993
2
原创 图片图像上传及图片压缩。
对于移动端手机拍照并上传图片的这种需求越来越多了，现在的手机随便一拍高清原图都应该有个十几兆的样子。可能也会出现拍照时图片的方向不对等等问题。小结一下。一、 使用命令npm i image-compressor.js这个具体要压缩的大小可根据各自的需要去调整。为了省事，样式部分可自己写。<img v-if="imgshow" @click="loadbtn"><div v-else ><img :src="temp" @click="loadbtn">.
2021-02-28 22:12:48
145
原创 多行溢出出现省略号及新增可展开功能。
前面发过一个关于多行溢出出省略号的js方案，有不少人私我 可以加个省略号后面带展开，并且点击展开可以进行展示所有文本。我今天休息就修改了一下之前的代码，并实现展示功能。简单粗暴，代码如下 ： moreline(id,rows,str){ var boxid = document.getElementById(id); var computedStyle = document.defaultView.getComputedStyle(boxid,null); v.
2021-02-21 21:47:51
676
1
原创 Vue实现微信分享好友，分享朋友圈。
实现微信分享功能。1 、基于vue去实现在微信里去分享给你的微信好友，或者去分享到你的朋友圈里。如果是react 等等 一样用法。2、目前实现微信分享功能是通过点击微信控件触发的，代码拿走直接用，因为分享出来的是一个有标题，有描述，有图标的一个类似连接，所以灵活使用，分享地址，分享图片，分享的话术等等根据各自的需求去写。3、使用到微信官网的api通过 npm i weixin-js-sdk 安装。最好在项目的main.js里暴露出来。html部分 <div class="box"
2021-01-25 10:11:11
9390
7
原创 多行溢出省略号显示（ccs/js）实现！
关于多行溢出显示省略号的问题，如果是根据字符的长度个数限制 超过部分替换为省略号，这种还是很好处理的，关键是根据行数，在未知情况下你不知道需要多少内容，去填满一个元素，做起来还是比较麻烦的，网上很多种乱七八糟的方案，拿过来又不能直接用，，我就结合网上的思路重新整理修改一波可以直接用的几种方案。一、单行溢出出现省略号显示：<div class="p">张艺兴张艺兴张艺兴张艺兴张艺兴</div>样式：.p{ width:1rem; overflow:hidden;//超出部分
2021-01-11 11:03:48
4037
8
原创 限制输入框30个字符/字节或15个汉字
就拿限制输入框30个字符15个汉字为例吧，当然灵活使用，方法封装好，你也可以20个字符10个汉字等等。js的方法，slice, substr等截取字符串的方法，全部都是以长度截取的，做不到按字节截取。如，input 自带的maxlength也是以长度限制。但是有时的需求需要我们按照字节限制输入框。如输入框只能输入30个字符，大于30时，则把超出的值替换为空。一个汉字=2字节=2字符一个字母、数字=1字节=1字符首先会用到两个知识点。正则与js方法正则：/[\x00-\xff]/表示匹配单字
2020-12-29 10:44:59
10709
15
原创 promise的用法与定义。
发现很多人其实一直在用promise原理，却不认识。或者只会用却说不出个所以然。。。。结合个人理解说下这个promise吧。首先在讲promise之前，我先简单的说下两个东西，一个构造函数，一个回调函数。什么是构造函数(实例方法):特点：构造函数的名称一般是开头字母是大写的this就是指实例，挂载在this上面的属性称为实例属性function Btn (val){//定义一个构造函数 this.val = val//挂载在this身上的实例属性}var w = new Btn ("
2020-12-07 23:26:09
1961
3
原创 javascript中同步程序与异步程序及（进程与线程）
在讲程序中的同步和异步时，先讲讲我们实际生活中什么是同步，什么是异步。为什么要先讲这个呢，是因为接下来我想写一个详细的promise的文章，所以为了做铺垫吧。。。顺便把进程与线程也说说。生活中的同步：就是指同时在做几件事情，同时进行同时做。生活中的异步：不是同时在做，不是同步进行的。大家都知道程序的执行顺序是自上向下执行的。那么程序中的同步和异步又是怎样的呢 其实和我们实际生活中的同步异步是相反的。程序中的异步代码：也称为不阻塞代码，就是指同时执行，如执行前面的代码不会阻塞后面的代码执行如下：
2020-11-23 23:44:10
269
1
原创 node搭建web服务器
在没有使用express库的情况下搭建web服务，也是很简单的，当然有express库搭个web服务更方便，后面会把使用express库搭建服务器的代码也补上哦~以及静态页面请求，动态请求（ajax 等 等陆续补上）nodeJs提供了http内置模块，可以用来构建服务器。首先需要用到 node里的 http模块引入模块 let http = require(‘http’)新建serve.js文件：let http = require('http');let server = http.c
2020-11-18 00:54:43
2506
15
原创 详讲npm的使用和配置！
详讲npm !可能好多人一直在用npm ,却分不清npm到底干嘛的，每次装node时就自动把npm 装好了，那么它们到底什么关系呢 ？别人问npm干嘛的，可能很模糊的回答一句用来装包的，那除了装一些包还有没有别的用处呢？我这里为了让不懂npm的看懂写的很啰嗦,哈哈大佬可以选择性看npm干嘛的 :帮助你安装模块（包），自动安装依赖（是指假如你安装了jquery这个包，它会帮你自动安装好jquery中所依赖的其他包），管理包（增，删，更新，项目所有包)，只是用来管理项目里所依赖的第三方包，并没有帮你管
2020-11-09 10:36:26
782
原创 地址栏传参及获取参数——封装方法!（直接拿来用）
说说这个地址栏如何传多个参数，以及如何获取多个参数。然后把这块的逻辑封装成个函数，可以直接调并能取到自己想要的参数和值。（路由跳转同理）先说说如何传参吧。传的参分为常量和变量两种如下：传的参数是常量时：传一个参数时直接问号后面添加变量和值 。如： https://editor.csdn.net/md/?id=110传多个参数时，参数和参数之间要用 &隔开。如：https://editor.csdn.net/md/?id=110&flag=112&uuid=119传的参
2020-10-31 00:23:40
5838
4
原创 彻底理解作用域！
理解作用域##结合上次的写的闭包，趁热打铁来讲讲作用域，希望有助于理解闭包和作用域。作用域能决定了从代码不同部分对变量，对对象，对函数是否有可访问性。在javascript 中作用域分为以：局部作用域 全局作用域（然后结合闭包，会提到链式作用域 ）顾名思义，局部作用域：就是在函数外部不能读取的变量，在函数内部去定义一个变量称局部变量，局部变量的作用域是局部的。function btn(){ var a ="1" console.log(a)//能取到}console.log(
2020-10-28 22:52:27
1614
11
原创 详讲闭包的定义和使用!
什么是闭包？及定义和使用想必好多前端开发者对于 闭包 都不陌生，也是面试中经常被问到的问题之一。先看看官方对闭包的解释：一个拥有许多变量和绑定了这些变量的环境的表达式的一部分。哎呀呀~说的好像有点抽象。以下是个人结合开发经验的理解：因为javascript语言是允许一个外部函数里可以定义一个内部函数的。简单说闭包：也就是一个函数可以定义在另一个函数体内。并且这个内部函数是可以访问外部函数里定义的局部变量。再简单点就是 ：一个函数里套一个函数。（闭包是定义在一个函数内部的函数）当这个内部函数在包含
2020-10-19 15:38:30
630
3
原创 详讲vuex的辅助函数mapState,mapGetters,mapActions,mapMutations
详讲vuex的映射函数mapState,mapGetters,mapActions,mapMutations作为一个使用vue框架的开发者，对vuex都不陌生，在这里就讲讲vuex的映射函数吧。希望对感兴趣的人有一些帮助。然后给个关注或者赞支持下，也可以加vx:w1421211413一起分享。html部分<template> <div class="demo1"> <div>没有使用mapState:{{$store.state.w1}}&
2020-09-23 01:00:07
508
原创 基于vue使用canvas实现移动端手写签名！
基于vue使用canvas实现移动端手写签名！之前自己开发有这么一个需求，需要实现手写签名，然后以图片的形式保存生成图片的base64数据流 。自己在网上找了一堆，都不是很完美。然后参考网上的加自己的优化和修改做了一版。希望有需要的朋友可以拿来直接用。有问题或者有更好的优化意见可以加我vx一起分享。HTML部分： 请输入您的签名7： Canvas画板 重写 保存签名 为了节约时间，样式写的比较简单。凑
2020-09-20 16:53:10
1434
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人