- 博客(63)
- 收藏
- 关注
原创 js如何打印dom的属性和方法
1、第一种console.log('%O', myDom)2、第二种console.dir(myDom);3、第三种console.log([myDom]);
2021-12-28 14:14:54 2348
原创 移动调试方法
一、原生ios:手机: 打开设置,选择safari,点高级,把js、web检查器勾上,然后用usb连接电脑。电脑: 打开safari,右上角设置菜单l列表中选中【偏好设置】,切换到【高级】选项卡,勾选【在菜单栏中显示开发菜单】,导航栏点开发选择手机进行调试。安卓:手机:在手机上打开开发者模式,用usb连接电脑。电脑:1. 打开chrome://inspect/#devices,选中网页,点击inspect(需要翻墙才行)2. 打开edge://inspect/#devices选中网页,点击in
2021-11-23 14:35:49 1085
原创 chrome浏览器inspect打不开解决方案
正常情况, 我们用访问chrome://inspect,点击inspect的方法来映射手机端webview页面查找元素,但是由于chrome这个页面是外网的,需要翻墙才能打开。解决办法:在edge浏览器里,输入chrome://inspect,跳转到edge://inspect页面,点击了inspect按键就可以成功映射手机端webview页面...
2021-11-16 14:49:05 3784
原创 pdfjs-dist插件渲染出来pdf文件不兼容iphone6、iphone8等问题
pdfjs-dist有时候会出现部分手机比如iphone6和iphone8渲染不出pdf问题解决办法:将pdfjs-dist版本降到2.2.228
2021-11-16 10:07:50 3421 2
原创 图片H5右侧和图片与图片之间出现白间隙问题
1.head里面增加:<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">2.图片增加样式img{ display:block}
2021-11-16 10:03:50 367
原创 vuex不同模块module之前相互调用actions、mutations 、state
state子模块拿到父模块或其他模块的state、gettersconst { commit, dispatch, state, rootState,rootGetters } = storeconsole.log(rootState) // 打印根 stateconsole.log(rootState.list) // 打印其他模块的 stateconsole.log(rootGetters['list/ceshi']) // 打印其他模块的 getters子模块拿到父模块或其他模块的mut
2021-10-20 17:45:49 1504
原创 vue中pdf在线预览-全页预览
1.安装vue-pdfnpm install --save vue-pdf2.引入vue-pdfimport pdf from "vue-pdf";//注册组件components: { pdf,}// 使用<div class="content" ref="content"> <pdf ref="pdf" v-for="i in numPages" :key="i" :src="url" :page="i" ></pdf
2021-10-11 17:53:03 970 1
原创 vue中使用svg图片,支持变色
安装插件npm install vue2-svg-icon --save-dev在vue.config.js文件中增加配置chainWebpack: (config) => { const svgRule = config.module.rule('svg') svgRule.uses.clear() svgRule.use('svg-sprite-loader').loader('svg-sprite-loader') .
2021-10-08 16:13:51 1147
原创 移动端实现页面滑动,顶部栏渐进变透明或变颜色
1.先监听页面滚动created() { window.addEventListener("scroll", this.handleScroll);},destroyed() { window.removeEventListener("scroll", this.handleScroll, true);},2.handleScroll方法```bashhandleScroll() { let scrollTop = window.pageYOffset |
2021-10-08 15:59:22 999
原创 vue3+ts 实现防抖功能
使用自定义 ref 实现带防抖功能的 v-modelimport { customRef } from 'vue'export function useDebouncedRef<T>(value: T, delay = 200) { let timeout: any = null return customRef((track, trigger) => { return { get() { track() return val
2021-09-23 13:44:37 1820
原创 js复制文本
function copyText(test: string) { if (document !== null) { const tag = document.createElement('input') tag.setAttribute('id', 'copyInput') tag.value = test document.getElementsByTagName('body')[0].appendChild(tag) const target: any =
2021-09-23 13:19:25 111
原创 小项目怎么代替vuex
1.新建store.js文件,写入import Vue from 'vue'const state = Vue.observable({ user: {}, productId: '',})const store = { state: state, dispatch: function (method, ...args) { return this.methods[method].apply(this, [...args]) }, me
2021-09-23 09:57:47 173
原创 防抖和节流方法和区别
防抖:当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时。const debounce = function(fn, wait) { let time; return function() { var context = this, args = arguments; time && clearTimeout(time); time = setTimeout(function{
2021-09-05 10:55:34 105
原创 点击区域外事件
//点击目标区域外事件const tagClickOutside = { bind(el, binding, vnode) { el.event = function (event) { if(!(el === event.target || el.contains(event.target) ) ) { if(binding.modifiers.stop) { event.stopPr
2021-09-05 10:45:33 230
原创 判断是否是IE浏览器
const userAgent = navigator.userAgent;const isIE =(userAgent.indexOf(‘compatible’)>-1 && userAgent.indexOf(‘MSIE’) || (userAgent.indexOf(‘Trident’)>-1 && userAgent.indexOf(‘rv:11.0’)>-1))
2021-09-05 10:04:48 201
原创 获取字符长度函数
const getStrFullLength = (str = '') =>{ str.split('').reduce((pre,cur)=>{ const charCode = cur.charCodeAt(0); if(charCode > 0 && charCode <=128){ return pre +1 } return pre +2 },0)}
2021-09-05 10:00:13 205
原创 vue 下载文件方法
const downLoadFile = function (blob, fileName, that, msg = ''){ if(blob.type === 'jsonString') { let reader = new FileReader(); reader.readAsText(blob.data, 'utf-8'); let resJson = {}; reader.onload = e =>{
2021-09-05 09:43:04 2321
原创 Visual Studio Code如何自动格式化代码
打开settings.json文件, 添加如下代码就行"editor.codeActionsOnSave": { "source.fixAll.eslint": true,}
2021-09-03 10:57:22 672
原创 vue3+ts 无法启用Vue-devtools解决方案
1.在main.ts文件中加入const win: any = windowif (process.env.NODE_ENV === 'development') { if ('__VUE_DEVTOOLS_GLOBAL_HOOK__' in win) { win.__VUE_DEVTOOLS_GLOBAL_HOOK__.Vue = app }}2.改动了main.ts别忘记重启下项目 npm run serve...
2021-09-03 10:38:59 800
原创 微信小程序流量主广告规范
链接:https://ad.weixin.qq.com/pdf.html?post_id=U2FsdGVkX19R4c4doadef3mH6MpQMKSYATStXILYIfI=下面是流量主案例,大家可以点击进去更直观感受广告规范:
2021-06-14 14:10:02 970
原创 微信小程序流量主广告分类展现形式
小程序广告分配常用的有五种,Banner广告、格子广告、视频广告、激励式广告和插屏广告,下面通过案例图片来更直观的了解他们的区别:1.Banner广告组件2.格子广告组件3.视频广告组件4.激励式广告组件5.插屏广告组件下面是流量主案例,可以扫描进去亲自感受下:...
2021-06-14 14:04:35 2340
原创 小程序成为流量主的条件
1.累计独立访客(UV)不低于 10002.存在刷粉行为或有严重违规记录的小程序不予申请3.同一个收款账户最多允许关联 50 个账号开户主体pc:uv统计一般需要隔一天,如果当天刚满足1000人,开通按钮可能不会点亮,需要多等一天下面是我的一个流量主的案例:...
2021-06-14 13:55:26 847
原创 ecpm是什么?
eCPM与移动游戏广告变现的收益密切相关,是衡量广告变现效果的重要指标之一。计算公式:eCPM=(当日广告收益/总广告展示次数)*1000
2021-06-12 09:14:18 5475
原创 vue开发必备神器:vue-devtools
vue-devtools 安装到github下载git clone https://github.com/vuejs/vue-devtools2.使用步骤a.在vue-devtools目录下安装依赖包cd vue-devtoolsnpm installnpm run build编译打包成功后会在shells下生成chrome文件夹。此文件夹就是用来放入chrome的扩展程序b.打开Chrome浏览器 >选择更多工具>扩展程序 >打开开发者模式3.vue-
2021-05-29 10:17:51 427
原创 Vue 数组/对象赋值,视图不更新问题
当这样操作数组和对象,会发现数据虽然改变了,但是视图就是不刷新this.arr[0] = 'newValue';this.obj.attr = 'newValue';解决办法:改变数组this.$set(this.arr, 0, "newValue");或使用splice()、 push()、pop()、shift()、unshift()、sort()、reverse()改变对象this.$set(this.obj, "c", "newValue");或使用this.obj= Ob
2021-05-29 10:01:50 1606
原创 vue简化技巧之‘hook:生命周期‘
常用案例mounted () { window.addEventListener('resize', this.resizeHandler);},beforeDestroy () { window.removeEventListener('resize', this.resizeHandler);}简化后mounted () { window.addEventListener('resize', this.resizeHandler); this.$on("hook:b
2021-05-26 22:47:20 202
原创 vue优化技巧之Object.freeze()
场景: 一个纯展示页面,没有数据修改,但是vue会做getter和setter的转换Object.freeze()是ES5新增的特性,可以冻结一个对象,防止对象被修改注意:冻结只是冻结里面的单个属性,引用地址还是可以更改今日头条极速版邀请码【941363528】抖音极速版邀请码【8121029958】快手极速版邀请码【426942961】番茄听书邀请码 【453330438】番茄免费小说邀请码【7556736071】...
2021-05-23 13:04:05 219
原创 vue常用的事件修饰符
.stop:阻止冒泡.prevent:阻止默认行为.self:仅绑定元素自身触发.once: 2.1.4 新增,只触发一次.passive: 2.3.0 新增,滚动事件的默认行为 (即滚动行为) 将会立即触发,不能和.prevent 一起使用今日头条极速版邀请码【941363528】抖音极速版邀请码【8121029958】快手极速版邀请码【426942961】番茄听书邀请码 【453330438】番茄免费小说邀请码【7556736071】...
2021-05-23 12:58:24 62
原创 vue优化技巧之mixins
场景:有些组件有些重复的 js 逻辑,mixins 就可以实现这种混入案例:定义const mixin={created(){this.dealTime()},methods:{dealTime(){console.log(‘这是mixin的dealTime里面的方法’);}}}引入export default{mixins:[mixin]}今日头条极速版邀请码【941363528】抖音极速版邀请码【8121029958】快手极速版邀请码【426942961】番茄听书
2021-05-23 12:55:19 351
原创 watch 深度监听及立即执行
立即执行:利用 watch 的immediate和handler属性简写深度监听:deep 属性深度监听, 监听复杂数据类型案例:atch:{someValue:{handler(oldVal,newVal){},deep:true,immediate: true}}今日头条极速版邀请码【941363528】抖音极速版邀请码【8121029958】快手极速版邀请码【426942961】番茄听书邀请码 【453330438】番茄免费小说邀请码【7556736071】...
2021-05-23 12:50:54 1064
原创 vue同时导入多个组件方法
require.context(directory,useSubdirectories,regExp)接收三个参数:directory:说明需要检索的目录useSubdirectories:是否检索子目录regExp: 匹配文件的正则表达式,一般是文件名案例const path = require(‘path’)const files = require.context(’@/components/home’, false, /.vue$/)const modules = {}files.
2021-05-23 12:42:13 1213
原创 vue elementUi 和 Ant 后台模板
elementUi 后台模板https://github.com/PanJiaChen/vue-element-adminAnt 后台模板https://github.com/ant-design/ant-design-pro
2020-06-08 17:40:16 622
原创 vue 创建+初始化项目
1.安装nodehttps://nodejs.org/en/2.安装cnpm$ npm install -g cnpm --registry=https://registry.npm.taobao.org3.安装vue脚手架npm install -g @vue/cli4.创建projectname项目, 按需求选择vue-cli 用的是 npm 源,只要设置 npm:npm config set registry https://registry.npm.taobao.org(Bab
2020-06-08 00:03:25 375
原创 媒体查询+scss 响应式开发
初始化样式:body { line-height: 1.6; color: #555; font: 14px "微软雅黑","黑体","宋体"}blockquote,body,button,dd,div,dl,dt,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul { margin: 0; padding: 0; -webkit-tap-highlight-color: rgba
2020-06-07 21:14:32 1692
转载 vue前端数据导出excel表格及后端数据导出excel方法
1.安装vue-json-excelnpm install vue-json-excel -S2.main.js里面引入并注册使用import JsonExcel from 'vue-json-excel'Vue.component('downloadExcel', JsonExcel)3、页面中使用<download-excel class = "export-excel-wrapper" :data = "json_data" :fields = "json
2020-06-01 00:24:25 2996 1
原创 vue后端返回数据流 前端导出下载xls文件
后端返回数据流, 前端导出下载xls文件export function exportMethod() {axios({method: get,url: url+‘params’,responseType: ‘blob’}).then((res) => {const link = document.createElement(‘a’)let blob = new Blob([res], {type: ‘application/vnd.ms-excel’})link.style.disp
2020-06-01 00:13:33 1445
原创 Apache设置反向代理解决跨域问题
1.打开Apache的这些模块,把签名的#去掉LoadModule proxy_module modules/mod_proxy.soLoadModule proxy_connect_module modules/mod_proxy_connect.soLoadModule proxy_ftp_module modules/mod_proxy_ftp.soLoadModule proxy_...
2020-04-28 14:56:43 1491
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人