超帅不是很帅-CSDN博客

原创 JavaScript原型继承的几种方式

这是我根据红宝石书得到的几种方式/** * 组合式继承 * 缺点两次调用父类的构造函数效率比较低 * */ function SuperType(name) { this.name = name this.colors = ['red', 'blue', 'green'] } SuperType.prototype.sayName = function() { console.log(this.n

2021-07-05 15:27:50 145

原创 js获取、今日、昨日的开始与结束时间戳

/** * 可以根据转入的天数获取前面某天的开始与结束时间戳 * @param {number} num 前面几天 */function getStartEndTime (num = 1) { // 一天的毫秒数 const MillisecondsADay = 24*60*60*1000 * num // 今日开始时间戳 const todayStartTime = new Date(new Date().setHours(0, 0, 0, 0)).getTime() // 今

2021-06-07 11:06:31 2680

原创 vue3中通过ref获取dom节点

话不多说直接看代码HTML <button @click.prevent="upload">上传</button> <-- 这里的ref必须与setup中return出来的 fileInput 同名 --> <input type="file" ref="fileInput"> <script lang="ts">import { defineComponent, ref } from "vue";export default d

2021-05-13 09:55:14 1220

原创 echarts中使用散点图根据后端接口动态生成点，并根据点数据动态渲染点颜色

实现效果如图点击 1 根据接口数据动态生成 2，并根据接口中的数据字段为数据渲染不同颜色，并且鼠标覆盖上去的提示信息不是渲染该数据点的值，而是根据接口获取下来的提示信息接口返回数据如下图1 =》红点 x 方向数据2 =》黑点 x 方向数据3 =》黑点提示信息（echarts中tooltip）的数据来源4 =》红点提示信息（echarts中tooltip）的数据来源重点来了配置 echarts 如下// 点击右侧点触发getDotByElevation(elevation)

2021-05-12 10:29:02 1171

原创简单进度条实现思路

2021-03-04 09:58:01 85 2

原创使用代理实现数据的双向绑定

<input type="text" v-model="title" /> <input type="text" v-model="title" /> <div v-bind="title">1</div><script> function Agency() { const proxy = new Proxy({},{ get(obj,key) { return obj[key] }, set(obj..

2021-02-03 14:23:45 95 1

原创 vue3自定义组件中的emits使用介绍

<template>  <div id="center" v-if="isOpen"> <slot>插槽</slot> <button @click="buttonClick">关闭模态框</button> </div></templ

2021-01-06 20:25:07 7151

原创在koa2中使用session

1、首先安装插件运行命名 npm i koa-generic-session koa-redis redis --save安装插件2、在app.js中引用并配置如下所示const Koa = require('koa')const app = new Koa()const session =require('koa-generic-session')const redisStore=require('koa-redis') app.keys=['你的加密字符串'] //用作于session

2020-09-08 16:06:49 768

原创 vue中使用element的loading组件对axios进行加载提示与错误提示封装处理

如果是看具体逻辑的老铁直接看第三步一、首先说这样封装的好处1、不必每次请求都调用loading加载提示，减少代码冗余2、对错误进行统一处理，提高代码可维护性实现的加载效果如图所示二、准备工作必须要在项目中安装axios、element安装命令 npm install axios npm i element-ui -S注意要在main.js的入口文件中安装element的组件如下import ElementUI from 'element-ui';import 'element

2020-08-31 15:41:31 1551 2

原创 nodejs设置cookie的过期时间，且不允许前端修改cookie,并解析cookie

const http=require('http')const querystring=require('querystring')//设置cookie过期时间const setCookieTiem=()=>{ let da=new Date() da.setTime( da.getTime() + 24*60*60*1000 ) //一天后过期 return da.toUTCString() //将 1598789234953这种格式的转换成=> "Sat, 29 Aug

2020-08-29 22:26:30 2107

原创使用nodeJS连接mysql数据库

1、新建项目并初始化该项目运行命令 npm init -y2、在项目中安装mysql插件运行命令npm i mysql3、新建一个js文件，并在该文件中引入mysql模块如下//cheshi.jsconst mysql =require('mysql'); //引入const con=mysql.createConnection({ //创建连接对象 host:'localhost', //主机地址 user:'root',//用户名 password:'你本地安装mysql

2020-08-28 15:52:21 760

原创 vue中路由跳转，参数的携带与获取

// 参数的携带两种方式如下(1) this.$router.push({ name:'orderDetail', params:{id:14} })(2) this.$router.push({ path:'/microcosm/orderDetail', params:{id:14} })// 获取参数对应上面的顺序(1) this.$route.params.id(2) this.$route.query.id第一种方式（1）携带的参数没有拼接在url地址后面；数据比较保密，但是n

2020-08-10 12:03:39 3590 1

原创 ES6中对象的解构赋值多重情况详解

代码如下// (1) 左侧简写形式let obj={ title:'xc', height:'180cm', bodyWeight:'70kg'}let {title,height,bodyWeight}=obj //左侧简写的形式和obj中定义的属性要一样 ,如果不一样为该变量为undefinedconsole.log(title,height,bodyWeight)// (2) 左侧不简写形式let obj={ title:'xc', height:'180cm',

2020-08-05 15:14:03 2261

原创 ES6中数组解构赋值多种情况详解

话不多说看代码// (1)普通解构赋值let arr=['1','2']let [str1,str2]=arrconsole.log(str1,str2) // 1,2// (2)我只需要取其中某一部分的情况let arr=['1','2','3','4']let [str1, , str2]=arr // 跳过谁使用逗号隔开console.log(str1,str2) // 1,3// (3)字符串解构赋值let zifu='abcde' let [str1,,str2]=zi

2020-08-05 10:00:59 836

原创 vue中在某个页面使用watch监听vuex中数据变化或者路由变化的写法

话不多说直接看代码watch:{ //监听vuex中userNumber的变化 '$store.state.userNumber'(val){ //变化之后根据自己项目需求写自身的逻辑代码，下面只是示例 if( !this.isLogin){ this.dialogVisibleLogin=val } }, //监听路由变化的写法 $route(to,from){ //to要前往的路由，from从那个路由过来 console.log

2020-07-30 09:52:32 2979

原创 vue中使用Vue-i18n插件实现页面中英文切换详细教程

1、在项目的根目录中安装插件 npm install vue-i18n2、新建文件夹与文件存放自己配置的语言包，我这里新建的是lang文件夹zh.js为中文语言包 en.js为英文语言包文件夹与文件可以随便命名，但在引用的时候需要写自己新建的文件夹与文件，如图所示3、入口文件main.js中引入并安装和配置该插件import VueI18n from 'vue-i18n' //引入Vue.use(VueI18n) //安装const i18n =new VueI18n({ loca

2020-07-27 18:34:57 2070 5

原创 vue中使用qrcode插件生成二维码

1、首先安装插件 npm install --save qrcode2、在要使用的页面中引入插件 import QRCode from 'qrcode'3、使用方式如下HTML部分<-- 这里是放置二维码的位置建议写一下样式将二维码的位置给预留出来 --><canvas id="canvas" class="yzq" >二维码位置</canvas >JS部分//url为扫描识别后跳转的地方，我这里是动态获取接口的地址//width、height分别为

2020-07-27 16:47:30 1452

原创 vue项目中实现复制粘贴功能

1、首先安装插件npm install --save vue-clipboard2 官方文档点击前往2、然后在项目入口文件main.js中引入和安装插件如下所示import VueClipboard from 'vue-clipboard2' //引入插件Vue.use(VueClipboard) //安装插件3、在需要使用复制功能的地方使用如下HTML部分<span v-clipboard:copy=" '这里是你需要

2020-07-27 13:25:52 1587 3

原创 vue中实现生成海报图片html2canvas详细教程

该插件详细配置文档地址建议谷歌浏览器打开，因为翻译的比较准确实现效果如图所示1.安装插件 npm install --save html2canvas2.将要生成图片的区域用大的元素包裹起来例如代码如下注意如果图片是通过接口来获取的，一定要后台配置一下nginx这个东西，本人在这里踩了坑的配置如下location / { add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow

2020-07-16 15:49:26 3196 1

原创 vue中按需引入elemen-ui组件时报错

如果不知道如何引入可以查看官方文档按需引入组件按照官网中的按需引入操作时，运行项目，会出现Error: Cannot find module 'babel-preset-es2015' from 'F:\anyu' 错误原因在于项目中没有这个模块，需要安装这个模块，运行命令npm i @babel/preset-env -D安装成功后修改项目中的 .babelrc 文件将其改为{ "presets": [["@babel/preset-env", { "modules": false }]],

2020-06-26 17:21:12 1171

原创 vue项目中图片懒加载，使用vue-lazyload插件

vue-lazyload插件官方文档地址官方文档链接1、首先是在vue项目中安装这个插件使用命令 npm i vue-lazyload -S2、在vue项目中的入口文件中将插件引入，即在main.js文件中引入并安装插件，并在Vue.use(VueLazyload,{})中配置参数。loading配置的是图片还在加载时的显示，我这里配置的是网上的一个加载图片具体参数配置可以看一下官方文档，其实使用只需配置少量参数即可，其它的使用官方默认的配置，就可以了。如图所示3、配置好参数后

2020-06-14 13:00:59 744

原创微信小程序中textarea组件如何去除上方的完成按钮

根据文档在组件中使用配置 show-confirm-bar属性即可如下图所示<textarea value="{{duohangValue}}" placeholder="请输入您的留言" fixed bindinput="liuyanleirong" class="duohang" show-confirm-bar='{{false}}' bindfocus="foucus" bindblur="blur" />show-confirm-bar一定要加{{}}

2020-06-03 15:44:03 1417

原创 vue项目运行时报Cannot read property ‘upgrade’ of undefined错误

报错如下图所示主要是因为在vue.config.js中使用了跨域代理，如下图所示主要原因是target字段后面是空的，如下图所示解决方法就是让target字段不为空，就可以运行起来了如下图所示

2020-05-27 13:08:39 20698 2

原创在谷歌浏览器中安装vue项目调试工具 vue-devtools详细安装步骤

谷歌浏览器安装vue-devtools插件前往GitHub下载vue-devtools文件文件地址文件链接在GitHub中下载时一定要选择master分支，不然在安装依赖是出现问题，如图所示文件下载完成后，进入文件打开命令栏窗口，输入命令npm install 安装依赖如下图所示依赖安装完成后，运行命令 npm run build 进行打包如下图所...

2020-04-28 13:32:33 2766

原创微信小程序中实现屏幕滚动到当前视频，自动播放该视频

实现的效果如下图所示文章的末尾我分享了一个代码片段出来，如果各位老铁有好的建议给我说一下首先是布局1、当前播放视频在页面是唯一渲染出来的，小程序官方建议视频组件在页面上，最多不超过3个其它没有播放的视频，用视频图片来代替<view class="shipin-list" wx:for='{{arrList}}' wx:key='index' > <view cl...

2020-03-27 21:31:55 8792 15

原创微信小程序中局部更新对象或者数组中的某个数据

数据结构如下图所示语法如下图所示index代表数组中要修改元素的下标最外层要用[ ] 括起来不然会出错

2020-03-27 19:48:37 3136

原创微信小程序中使用阿里字体图标（无需下载字体文件到本地）

在微信小程序中使用iconfont字体图标（无须下载字体文件到本地）使用过iconfont图标的老铁们可以直接看第6步进入阿里字体图标官网，在搜索栏中搜索自己需要的图标2.加入到购物车后，点击购物车3.点击添加至项目4.点击添加项目出现如下图所示，如果没有项目可以新建项目，有项目就直接选择5.点击上图的确定按钮后，会跳转到如下图所示页面，点击复制代码6.重点来了，将复制的...

2020-03-17 16:19:36 650

qq_43241161的博客