weixin_44953689的博客

原创 多链接集合。

1、

原创 收藏博客作者

1、大神博客

原创 链接集合。

1、vue中使用百度地图1-2、Vue中使用百度地图Vue Baidu Map(vue-baidu-map)2、vue中实现滑动验证3、Vue中使用Ckplayer播放器3-2、vue中使用CyberPlayer4、vue中公共头部底部的显示与隐藏5、video.js6、vue中实现锚点定位7、Ant Design组件库8、BootstrapVue组件库9、在Vue中使用echarts10、在vue-cli中封装一个类似电商的从右至左滚动公告的组件...

原创 vue使用three.js实现粒子波浪效果

vue使用three.js实现粒子波浪效果

原创 vue在线预览word文件

vue在线预览doc文件

原创 vue中获取用户IP地址

【代码】vue中获取用户IP地址。

原创 vue中使用echarts的chain.js生成地图散点图以及性能优化

使用地图时因为返回的数据点太多，造成页面加载过慢，卡顿等影响，优化过后，性能提升。1、创建map.vue组件<template> <div class="map"> <h3> <span class="icon-cube"></span> 活跃运营中心数据统计 </h3> <div class="geo" id="geo"></div> </div

原创 js模拟键盘事件

// 模拟浏览器键盘事件function keyEvent(key) { var e = $.Event('keydown'); e.keyCode = key; e.which = key; $(window).trigger(e); if(key == 13) { console.log('按下回车键') }}keyEvent(13)

原创 港澳台、内地身份证号校验规则

// 内地身份证号校验let reg = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i;// 中国香港 let reg2 = /[A-Z][0-9]{6}\([0-9A]\)/;// 中国澳门let reg3 = /[157][0-9]{6}\([0-9]\)/;// 中国台湾 let reg4 = /^[a-zA-Z][0-9]{9}$/;...

原创 vue中禁用右键，禁止选中

原创 vue数字滚动效果

1、安装vue-count-tonpm install vue-count-to --save2、引入注册import countTo from 'vue-count-to' components: { countTo },3、使用<template> <div> <countTo :startVal="startVal" :endVal="endVal" :duration="2000"></countTo> &

原创 本地电脑localhost指向127.0.0.1的配置

1、参考2、更改ip指向，项目域名，保存3、浏览器重新打开

原创 vue中实现h5分享截图

1、html2canvas官方文档

原创 ios中时间格式不兼容问题

1、vant组件中CountDown 倒计时组件 ios不生效2、时间格式不兼容原因： 是因为ios解析时间方式和其他不一样，需要把 - 转化为 / 然后才能转时间戳 原因是yyy-mm-dd hh:mm:ss 格式ios不识别 把yyy-mm-dd hh:mm:ss 格式转换成 yyy/mm/dd hh:mm:ss解决方法： var timeStr = '2019-08-15' var time = time.replace(/-/g, '/') console.log(ti

原创 获取某个时间点的时间戳

new Date(‘2020-3-14 11:30:00’).getTime()指定时间自动隐藏弹窗if (new Date().getTime() > new Date("2021-6-1 20:00:00").getTime()) { this.show = false;}

原创 vue引入scss文件或者less文件，报错 this.getOptions is not a function

原因是sass-loader版本过高1、npm uninstall sass-loader（卸载当前版本）2、npm install sass-loader@7.3.1 --save-dev

原创 uniapp中动态设置clac

:style="{ maxHeight: 'calc(100vh - ' +headerTop + 'px - 49px)'}"

原创 uniapp打包安卓app自动更新（整包更新）

// 写在onload中 防止不停地提示 onLoad() { // 添加条件编译 只在APP中执行改代码，防止报错 // #ifdef APP-PLUS uni.getSystemInfo({ success: (res) => { var _this = this; //检测当前平台，如果是安卓则启动安卓更新 if (res.platform == "android") { ...

原创 vue中关闭浏览器清除localStorage

1.在app.vue中关闭浏览器清除信息，并且刷新时保持状态不受影响 mounted() { window.onload = function () { console.log(window.sessionStorage["ISlogin"]); if (!window.sessionStorage["ISlogin"]) { // 关闭浏览器 window.localStorage.removeItem("userInfo");

原创 vue中使用alipalyer（2）

新加 1. 右侧目录默认选中功能2. 自动播放下一集 并记录时间，设置播放时间<template> <div> <div @contextmenu.prevent class="w"> <div class="video_page"> <div class="vedio_top"> <div class="vedio_tit"> <img

原创 uniapp根据链接生成二维码

兼容小程序和h5、app参考地址

原创 vue中实现图形验证

1. 封装一个组件<template> <div class="s-canvas"> <canvas id="s-canvas" :width="contentWidth" :height="contentHeight" ></canvas> </div></template><script>export default { name: "SIdenti

原创 vue中生成二维码

参考地址1、安装npm i vue-qriously -S2、在main.js中// 生成二维码import VueQriously from 'vue-qriously'Vue.use(VueQriously)3、页面中使用 <qriously :value="url" :size="120" /> data() { return { url:'http:..........' } }...

原创 vue中动态修改meta头部标签

参考地址使用案例app.vue页面中<template> <div id="app"> <!-- <div id="nav"> <router-link to="/">Home</router-link> | </div> --> <router-view /> </div></template><script>imp

原创 阿里播放器的使用Aliplayer

阿里在线配置<template> <div> <div @contextmenu.prevent class="w"> <div class="video_page"> <div class="vedio_top"> <div class="vedio_tit"> <img @click="goBack"

原创 vue使用echarts挂载数据

<style lang="less" scoped>.class_tabs { border-bottom: 1px solid #dddddd; .tabsList { width: 120px; text-align: center; font-size: 16px; color: #0c69e6; height: 64px; line-height: 60px; padding: 0 20px; box-sizing

原创 vue中实现点击复制功能

<div class="lianjie_box"> <div class="dizhi">{{ url }}</div> <div class="dizhi_btn" @click="copyUrl" :data-clipboard-text="url" > <img src="../../assets/img/personal/icon_lian..

原创 vue中一键返回顶部功能

<div @click=" goTop">返回顶部</div> mounted() { window.addEventListener("scroll", this.handleScroll); }, destroyed() { document.removeEventListener("scroll", this.handleScroll); }, methods: { handleScroll() { const that

原创 vue中全局配置页面切换自动回到顶部

1.在main.js或者router.js添加代码Router.afterEach((to, from, next) => { window.scrollTo(0, 0); // 或 // window.scroll(0, 0);});

原创 vue打包之后在本地预览报错Failed to load resource: net::ERR_FILE_NOT_FOUND

1、创建vue.config.js文件module.exports = { // 选项... publicPath: "./", //打包时加上 // devServer: { // https: false, // proxy: { // '/api': { // target: 'http://120.78.95.239', // changOrigin: true, // pathRewrite: { //

原创 uniapp云打包生成证书并打包

1、参考资料 ：https://blog.youkuaiyun.com/weixin_42036591/article/details/88752679?utm_medium=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachin

原创 vue中实现上传功能

<div class="tx_box"> <img v-if="imageUrl" :src="imageUrl" alt="" /> <img v-else src="../../assets/img/home/img8.png" alt="" /> <div @click.stop="uploadHeadImg">修改头像</div> <input type="fi.

原创 小程序中监听键盘回车事件

<input @input="goSearch" confirm-type="搜索" @confirm="confirmTap" v-model="search" placeholder-style="font-size:12px;color:#999;" methods:{ // 点击软键盘回车 confirmTap: function() { let that = this; console.log('我点击了回车') that.goToSearch() },

原创 小程序请求封装（二）

1.在main.js 里写import http from './static/js/api/request.js'import qs from "qs"Vue.prototype.$http = http2.创建request.ks页面import qs from "qs"const baseUrl = 'https://*****.com';const httpRequest = (url, method = "get", data) => { let token = un

原创 小程序请求封装request（一）

1. 创建request.jsimport qs from "qs"const baseUrl = 'http://xlw.fukaowang.com';const request = (url, data) => { let token = uni.getStorageSync('token') // console.log(token) return new Promise(function(resolve, reject) { uni.showLoading({ titl

原创 小程序中实现横向滚动点击平滑

<template> <view> <!-- tabs --> <view class="scroll-view-container"> <scroll-view :show-scrollbar="false" scroll-x="true" :scroll-left="x" :scroll-with-animation="true"> <view class="tab-container"> <

原创 vue中实现锚点定位以及平滑滚动到指定位置。

// 点击此处 <div @click="goDingyue">立即订阅</div> // 跳转到该位置 <div class="dingyue_box" ref="dingyue_box_ref"> 立即订阅内容 </div> methods: { goDingyue() { // 获取元素在页面中的位置 console.log(this.$refs.dingyue_box_ref.getB

原创 vue中实现滚动头部导航背景变色

<template> <div class="header" :style="style" :class="{ color: color }"> 这是头部 </div></template><script>export default { data() { return { style: { backgroundColor: "", }, color: false

原创 关于eslint.

vue cli 中取消eslint1. 在项目根目录下增加vue.config.js文件。module.exports = { lintOnSave: false}

原创 修改浏览器滚动条样式

div::-webkit-scrollbar{ width:12px; height:12px;}div::-webkit-scrollbar-track{ background: rgb(239, 239, 239); border-radius:2px;}div::-webkit-scrollbar-thumb{ background: #bfbfbf; border-radius:10px;}div::-webkit-scrollbar-thumb:hover{