首页
壁纸
直播
留言
关于
友链
统计
Search
1
tampermonkey油猴和谷歌访问助手的安装---破解谷歌访问助手
13,762 阅读
2
编译asar文件与electron反编译
3,357 阅读
3
安装postcss-px-to-viewport,将px单位转换为视口单位的 (vw, vh, vmin, vmax) 的 PostCSS 插件(有更新postcss弃用,附带vite.config.ts文件)
3,272 阅读
4
websocket封装带心跳和重连机制(vue3+ts+vite)
2,859 阅读
5
js一些小功能(持续更新)
2,454 阅读
大前端
JavaScript
CSS
HTML
框架
Vue
electron
element-ui/plus
小程序
微信小程序
uni-app
服务端
Node.js
nginx
PHP
MySQL
工具
杂记
登录
Search
标签搜索
Vue3
Vue
Axios
微信小程序
Javascript
Vuex
js
请求
request
前端
tampermonkey
Google
助手
脚本
小程序云开发
Bootstrap
壁纸
鼠标事件
跨域
css
大祥子i
累计撰写
55
篇文章
累计收到
128
条评论
首页
栏目
大前端
JavaScript
CSS
HTML
框架
Vue
electron
element-ui/plus
小程序
微信小程序
uni-app
服务端
Node.js
nginx
PHP
MySQL
工具
杂记
页面
壁纸
直播
留言
关于
友链
统计
搜索到
34
篇与
大前端
的结果
2021-10-12
Vue事件中心管理传递--组件传值--传值
{mtitle title="新建js文件Bus.js"/}// 事件中心 import Vue from 'vue' export default new Vue(){mtitle title="A页面"/} // 引入事件中心传递 import Bus from '../../util/Bus' // 发送 Bus.$emit('名称', 数据){mtitle title="B页面"/}// 引入事件中心传递 import Bus from '../../util/Bus' // 接收,最好放在created里接收 Bus.$on('treeData', treeData => { this.treeData = treeData // console.log('我是树形:' + treeData) })
2021年10月12日
288 阅读
0 评论
0 点赞
2021-10-12
Vue简单封装Axios
{mtitle title="新建api.js文件"/}/* * @Author: lzx * @Date: 2021-10-12 13:12:08 * @LastEditors: lzx * @LastEditTime: 2021-10-12 14:20:44 * @Description: Fuck Bug * @FilePath: \xsy-auth\src\util\api.js */ // 引入axios import axios from 'axios' // axios.defaults.baseURL = 'http://127.0.0.1:8000' // 设置请求后端的URL地址 axios.defaults.timeout = 2000 // axios请求超时时间 // // 头部携带token axios.defaults.headers.common.token = sessionStorage.getItem('token') // get请求 const get = (url, param) => { return new Promise((resolve, reject) => { axios.get(url, { param }).then(res => { resolve(res.data) }).catch(err => { reject(err.data) }) }) } // put请求 const put = (url, data) => { return new Promise((resolve, reject) => { axios.put(url, data).then(res => { resolve(res.data) }).catch(err => { reject(err.data) }) }) } // delete请求 const del = (url, data) => { return new Promise((resolve, reject) => { axios.delete(url, data).then(res => { resolve(res.data) }).catch(err => { reject(err.data) }) }) } // post请求 const post = (url, data) => { return new Promise((resolve, reject) => { axios.post(url, data).then(res => { resolve(res.data) }).catch(err => { reject(err.data) }) }) } export { get, put, del, post } {mtitle title="main.js中引用"/}// 引入封装的Axios import { get, put, del, post } from './util/api.js' // 使用封装的Axios Vue.prototype.$get = get Vue.prototype.$put = put Vue.prototype.$delete = del Vue.prototype.$post = post{mtitle title="全局页面中使用方式"/}// 1、get请求 thi.$get('url').then(res => { console.log(res.data) }) // 2、put请求 this.$put('url', {有携带 | 没有可以直接如下}).then(res => { console.log(res.data) }) this.$put('url').then(res => { console.log(res.data) }) //this.$delete...如上 //this.$post...如上
2021年10月12日
168 阅读
0 评论
0 点赞
2021-10-09
js操作数组、数组对象案例集合-持续更新-记录工作用到的一些常见或不常见功能
在vue中遇到个需求,需要将后端给的列表倒叙展示(找后端直接给倒叙过的最简单),将数组或者数组对象倒叙输出 let arr = ["Vue","JavaScript","Array"]; //创建数组 let arrObj = [ { id: 1, name: 'vue', }, { id: 2, name: 'JavaScript', } ]; //创建数组对象 reverse函数: console.log(arr.reverse()) //颠倒顺序并输出
2021年10月09日
374 阅读
0 评论
0 点赞
2021-09-30
Vue2/3导出PDF或图片
1、npm引入相应的包npm i html2canvas -S npm i jspdf -S // 导出图片无需安装jspdf2、使用:引入封装的js,直接调用封装的方法并传入获取的dom和文件名字(封装好的方法见下文)<div ref="exportPDF"></div> // 需要导出的dom import exportPdf from '@utils/exportPDF' // 引入封装好的导出方法(见下文) // Vue3写法直接使用ref获取dom const exportPDF = ref(null) // 通过ref获取dom exportPdf(exportPDF.value, '排名列表统计') // 使用封装好的PDF方法 // Vue2写法通过this.$refs获取dom let dom = this.$refs.exportPDF.$el exportPdf(dom, '排名列表统计') // 使用封装好的PDF方法{mtitle title="封装的导出PDF方法"/}/* * @Author: lzx * @Date: 2022-04-06 13:39:55 * @LastEditors: lzx * @LastEditTime: 2022-04-06 14:51:34 * @Description: Fuck Bug * @FilePath: \cs_talk_admin\src\utils\exportPDF.js */ /** * 封装导出PDF方法 */ import html2Canvas from 'html2canvas' import JsPDF from 'jspdf' export function exportPdf (dom, title) { html2Canvas(dom,{ backgroundColor: "#ffffff", // 背景颜色 dpi: 96, // 将分辨率提高到特定的dpi,默认值为96 allowTaint: true, // 开启跨域 useCORS: true, // 是否尝试使用CORS从服务器加载图像(跨域) scrollY: 0, // Y轴偏移 scrollX: 0, // X轴偏移 scale: 1, // 用于渲染的比例尺。默认为浏览器设备像素比率。默认值是1,手机端设置成2 }).then((canvas) => { var contentWidth = canvas.width var contentHeight = canvas.height // 一页pdf显示html页面生成的canvas高度; var pageHeight = contentWidth // 未生成pdf的html页面高度 var leftHeight = contentHeight // 页面偏移 var position = 0 // a4纸的尺寸[595.28,841.89],html页面生成的canvas在pdf中图片的宽高 var imgWidth = 595.28 var imgHeight = (592.28 / contentWidth) * contentHeight var pageData = canvas.toDataURL('image/jpeg', 1.0) var PDF = new JsPDF('', 'pt', 'a4') if (leftHeight < pageHeight) { PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight) } else { while (leftHeight > 0) { PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight) leftHeight -= pageHeight position -= 841.89 if (leftHeight > 0) { PDF.addPage() } } } PDF.save(title + '.pdf') // 这里是导出的文件名 }) } {mtitle title="封装的导出图片方法"/}/* * @Author: lzx * @Date: 2022-04-06 13:39:55 * @LastEditors: lzx * @LastEditTime: 2022-04-06 13:39:55 * @Description: Fuck Bug * @FilePath: \tree\src\utils\exportImg.js */ /** * 封装导出图片方法 */ import html2Canvas from 'html2canvas' export function exportImg (dom, title) { html2Canvas(dom,{ backgroundColor: "#ffffff", // 背景颜色 dpi: 96, // 将分辨率提高到特定的dpi,默认值为96 allowTaint: true, // 开启跨域 useCORS: true, // 是否尝试使用CORS从服务器加载图像(跨域) scrollY: 0, // Y轴偏移 scrollX: 0, // X轴偏移 scale: 1, // 用于渲染的比例尺。默认为浏览器设备像素比率。默认值是1,手机端设置成2 }).then((canvas) => { // 生成图片,设置导出质量(0-1) var imgURL = canvas.toDataURL('image/jpeg', 1.0) // 创建a标签,模拟点击下载 const $a = document.createElement("a"); $a.setAttribute("download", title); $a.href = imgURL; $a.click(); }) }特别注意:网络图片存在跨越问题的,导出后会不显示图片,解决方法修改图片跨越问题,或者图片转换为Base64格式(本地图片也可),相应html2Canvas配置(跨域)见代码!
2021年09月30日
1,096 阅读
0 评论
56 点赞
2021-09-24
Vue3使用Ctrl+enter换行&组合键
执行 @keyup.enter.exact="send" // 发送消息,回车 @keyup.ctrl.enter="lineFeed" // 执行换行 const lineFeed = () => state.sendMessage = state.sendMessage + '\n' } 打印键盘事件,其中有个ctlKey的值,ctlKey是false的话就说明ctrl未按下,可以以此作为判断如下// 13是键盘回车值 if (e.ctlKey === true && e.keyCode = 13) { console.log("执行了我") }
2021年09月24日
1,235 阅读
0 评论
20 点赞
1
...
3
4
5
...
7