当前位置: 首页 > news >正文

各种需要使用的方法-->vue/微信小程序/layui

各种需要使用的方法-->vue/微信小程序/layui

  • 1、vue里样式不起作用的方法,可以通过deep穿透的方式
  • 2、 js获取本周、上周、本月、上月日期
  • 3、ArrayBuffer Blob 格式转换
      • ArrayBuffer与Blob的区别
      • ArrayBuffer转Blob
      • Blob转ArrayBuffer需要借助fileReader对象
  • 4、使用有赞小程序组件的小程序编译成H5后报Unclosed bracket
  • 5、js根据id、pid把数据转化为树结构
  • 6、【实践】从零开始一个文件分块上传【后端为Golang】
  • 7、LayUI laydate日期选择器自定义 快捷选中今天、昨天 、本周、本月等等
  • 8、cc-comment 评论列表,回复,点赞,删除组件 vue3.2+uni-ui
  • 9、生成二维码的 jQuery 插件:jquery.qrcode.js的中文乱码问题
  • 10、PCX转PNG
  • 11、图片转文字在线
  • 12、DCloud插件市场
  • 13、Layui-Vue 框架
  • 14、jQueryUI插件
  • 15、jquery代码

1、vue里样式不起作用的方法,可以通过deep穿透的方式

vue里可以使用/deep/或者::v-deep来做穿透
1、在less里

<style lang='less' scoped>/deep/ 第三方组件类名{样式}
</style>

2、在scss里

<style lang='scss' scoped>::v-deep 第三方组件类名{样式}
</style>

3、>>> 操作符
这是CSS中的一种深度作用选择器,如果你的CSS样式定义了scss/less等预处理器的话可能无法识别(stylus预处理器的样式可以穿透)。比如我引用了element中的el-popover组件,现在想重新定义el-popover组件中的样式。当使用普通的css样式来定义时就可以使用>>> 操作符来深度操作el-popover组件中的样式,如下所示
在这里插入图片描述

2、 js获取本周、上周、本月、上月日期

注:下述代码假定一周的第一天是周日,最后一天是周六,并且月份从0开始(0表示一月,1表示二月,依此类推)

// 获取今天的日期
var today = new Date();
// 获取本周的第一天(周日)
var firstDayOfWeek = new Date(today.setDate(today.getDate() - today.getDay()));
// 获取本周的最后一天(周六)
var lastDayOfWeek = new Date(today.setDate(today.getDate() - today.getDay() + 6));
// 获取上周的第一天(周日)
var firstDayOfLastWeek = new Date(firstDayOfWeek.setDate(firstDayOfWeek.getDate() - 7));
// 获取上周的最后一天(周六)
var lastDayOfLastWeek = new Date(lastDayOfWeek.setDate(lastDayOfWeek.getDate() - 7));
// 获取本月的第一天
var firstDayOfMonth = new Date(today.getFullYear(), today.getMonth(), 1);
// 获取本月的最后一天
var lastDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, 0);
// 获取上月的第一天
var firstDayOfLastMonth = new Date(today.getFullYear(), today.getMonth() - 1, 1);
// 获取上月的最后一天
var lastDayOfLastMonth = new Date(today.getFullYear(), today.getMonth(), 0);
// 存储本周的所有日期
var datesOfWeek = [];
// 存储上周的所有日期
var datesOfLastWeek = [];
// 存储本月的所有日期
var datesOfMonth = [];
// 存储上月的所有日期
var datesOfLastMonth = [];
// 循环添加本周的所有日期到数组
for (var i = firstDayOfWeek; i <= lastDayOfWeek; i.setDate(i.getDate() + 1)) {datesOfWeek.push(new Date(i));
}
// 循环添加上周的所有日期到数组
for (var j = firstDayOfLastWeek; j <= lastDayOfLastWeek; j.setDate(j.getDate() + 1)) {datesOfLastWeek.push(new Date(j));
}
// 循环添加本月的所有日期到数组
for (var k = firstDayOfMonth; k <= lastDayOfMonth; k.setDate(k.getDate() + 1)) {datesOfMonth.push(new Date(k));
}
// 循环添加上月的所有日期到数组
for (var l = firstDayOfLastMonth; l <= lastDayOfLastMonth; l.setDate(l.getDate() + 1)) {datesOfLastMonth.push(new Date(l));
}
// 打印输出本周的所有日期
console.log("本周的所有日期:");
datesOfWeek.forEach(function(date) {console.log(date.toDateString());
});
// 打印输出上周的所有日期
console.log("上周的所有日期:");
datesOfLastWeek.forEach(function(date) {console.log(date.toDateString());
});
// 打印输出本月的所有日期
console.log("本月的所有日期:");
datesOfMonth.forEach(function(date) {console.log(date.toDateString());
});
// 打印输出上月的所有日期
console.log("上月的所有日期:");
datesOfLastMonth.forEach(function(date) {console.log(date.toDateString());
});

3、ArrayBuffer Blob 格式转换

ArrayBuffer与Blob的区别

ArrayBuffer对象:表示通用的、固定长度的原始二进制数据缓冲区。
Blob (binary large object):表示一个不可变、原始数据的类文件对象。
blob类型只有slice方法,用于返回一个新的 Blob对象,包含了源 Blob对象中指定范围内的数据。
对比发现,ArrayBuffer的数据,是可以按照字节去操作的,而Blob的只能作为一个整的对象去处理。
所以,ArrayBuffer相比Blob更接近真实的二进制,更底层。

ArrayBuffer转Blob

// arraybuffer转blob很方便,作为参数传入即可
var buffer = new ArrayBuffer(16)
var blob = new Blob([buffer])

Blob转ArrayBuffer需要借助fileReader对象

let blob = new Blob([1,2,3,4,5]);
let reader = new FileReader();reader.onload = (e) => {let outbuffer: ArrayBuffer = e.target!.result as ArrayBuffer;console.log(outbuffer)// 控制台输出的则是ArrayBuffer的数据了};reader.readAsArrayBuffer(blob);

4、使用有赞小程序组件的小程序编译成H5后报Unclosed bracket

问题描述
如题所说的那样。原工程从微信小程序转换成uni,早期的时候使用了vant的小程序组件。编译时报标题所示错误。

补充信息
解决方法很简单,只要把两个逗号换行就可以了。

更改 wxcomponents/icon/index.wxss 文件
在这里插入图片描述

5、js根据id、pid把数据转化为树结构

//格式化树数据
function toTreeData(data) {var pos = {};var tree = [];var i = 0;while(data.length != 0) {if(data[i].pid == null) {tree.push({id: data[i].id,name: data[i].text,children: []});pos[data[i].id] = [tree.length - 1];data.splice(i, 1);i--;} else {var posArr = pos[data[i].pid];if(posArr != undefined) {var obj = tree[posArr[0]];for(var j = 1; j < posArr.length; j++) {obj = obj.children[posArr[j]];}obj.children.push({id: data[i].id,name: data[i].text,children: []});pos[data[i].id] = posArr.concat([obj.children.length - 1]);data.splice(i, 1);i--;}}i++;if(i > data.length - 1) {i = 0;}}return tree;
}

6、【实践】从零开始一个文件分块上传【后端为Golang】

地址:https://juejin.cn/post/6844904159372656654#comment

7、LayUI laydate日期选择器自定义 快捷选中今天、昨天 、本周、本月等等

  1. 引入laydata插件
      下载 https://blog-static.cnblogs.com/files/zhangning187/laydate.js laydate.js
      替换laydate.js,就可以直接使用自定义快捷选中了
    2.自定义控件选取值
laydate.render({elem: '#freeTimeInput', //指定元素range: true,trigger: 'click', //采用click弹出value: '',extrabtns: [{id: 'today',text: '今天',range: [new Date(new Date().setDate(new Date().getDate())), new Date(new Date().setDate(new Date().getDate()))]},{id: 'yesterday',text: '昨天',range: [new Date(new Date().setDate(new Date().getDate() - 1)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'lastday-7',text: '近7天',range: [new Date(new Date().setDate(new Date().getDate() - 7)), new Date(new Date().setDate(new Date().getDate() - 1))]},{id: 'lastday-30',text: '近30天',range: [new Date(new Date().setDate(new Date().getDate() - 30)), new Date(new Date().setDate(new Date().getDate() - 1))]}],done: function (val, stdate, ovdate) {// 确认选择事件后调用}});

在这里插入图片描述

8、cc-comment 评论列表,回复,点赞,删除组件 vue3.2+uni-ui

地址:https://ext.dcloud.net.cn/plugin?id=16266

9、生成二维码的 jQuery 插件:jquery.qrcode.js的中文乱码问题

function toUtf8(str) {var out, i, len, c;out = "";len = str.length;for (i = 0; i < len; i++) {c = str.charCodeAt(i);if ((c >= 0x0001) && (c <= 0x007F)) {out += str.charAt(i);} else if (c > 0x07FF) {out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));} else {out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));}}return out;
}
var str = toUtf8("钓鱼岛是中国的!");   
$('#code').qrcode(str); 

10、PCX转PNG

地址: https://cn.office-converter.com/pcx-to-png

11、图片转文字在线

地址:https://web.baimiaoapp.com/

12、DCloud插件市场

地址:https://ext.dcloud.net.cn/

13、Layui-Vue 框架

地址:http://www.layui-vue.com/zh-CN/components/checkbox

14、jQueryUI插件

地址:https://www.jq22.com/jqueryUI-1-jq

15、jquery代码

地址:https://sc.chinaz.com/jiaoben/

相关文章:

各种需要使用的方法-->vue/微信小程序/layui

各种需要使用的方法-->vue/微信小程序/layui 1、vue里样式不起作用的方法&#xff0c;可以通过deep穿透的方式2、 js获取本周、上周、本月、上月日期3、ArrayBuffer Blob 格式转换ArrayBuffer与Blob的区别ArrayBuffer转BlobBlob转ArrayBuffer需要借助fileReader对象 4、使用…...

360奇酷刷机 360刷机助手 QGDP360手机QGDP刷机

360奇酷刷机 360刷机助手 QGDP破解版360手机QGDP刷机 360手机刷机资源下载链接&#xff1a;360rom.github.io 参考&#xff1a;360手机-360刷机360刷机包twrp、root 360奇酷刷机&#xff1a;360高通驱动安装 360手机刷机驱动&#xff1b;手机内置&#xff0c;可通过USB文件传输…...

2299. 强密码检验器 II

文章目录 题意思路代码 题意 题目链接 判断是否合法密码 思路 if 代码 class Solution { public:bool strongPasswordCheckerII(string password) {if (password.size() < 8)return false;int visit 0;for (size_t i 0; i < password.size(); i){char &ch pa…...

跟着cherno手搓游戏引擎【29】Batch简单合批

思路&#xff1a; CPU和GPU都开辟同样大小的一大块内存&#xff08;为了存储顶点信息&#xff09; 索引在程序运行时生成对应规则后绑定到索引缓冲中 动态生成顶点信息&#xff08;现在改成Drawquad只是确定图形顶点的位置&#xff09; 然后在Endscene&#xff0c;将CPU的动…...

粘包/半包及解决方案

一、粘包/半包介绍 1&#xff1a;粘包 粘包&#xff08;Packet Concatenation&#xff09;通常发生在基于流式传输协议&#xff08;如 TCP&#xff09;的通信中&#xff0c;因为 TCP 是面向流的传输协议&#xff0c;它不保证数据包的边界&#xff0c;而是将数据视为连续的字节…...

2024华为软件精英挑战赛记录

前言 本次主要是记录自己第一次参加华为软件挑战赛的经历。第一次参加比赛还是缺少经验&#xff0c;训练赛中拿到赛区的20多名&#xff0c;最后在正式赛中被反超了&#xff0c;只拿了40多名&#xff0c;实在是感到可惜。 题目&#xff1a;本次题目是一个智慧港口的问题。10个机…...

数据可视化艺术:Matplotlib与Seaborn实战

目录 1.Matplotlib基础绘图与定制化 1.1. 基础绘图 1.2. 定制化 2.Seaborn高级图表类型与样式设定 2.1. 高级图表类型 2.2. 样式设定 3.实战&#xff1a;绘制多维度数据可视化报告 4.总结 1. 前言 在数据科学领域&#xff0c;数据可视化扮演着至关重要的角色。通过图形化…...

python初级第一次作业

一、 dayint(input("enter today day")) fdayint(input("enter num of day since today")) c((fday%7)day)%7 if c0:print("sunday") elif c1:print("monday") elif c2:print("tuesday") elif c3:print("wendnsday&quo…...

Spring Boot整合Camunda打造高效工作流程

&#x1f389;&#x1f389;欢迎来到我的CSDN主页&#xff01;&#x1f389;&#x1f389; &#x1f3c5;我是尘缘&#xff0c;一个在CSDN分享笔记的博主。&#x1f4da;&#x1f4da; &#x1f449;点击这里&#xff0c;就可以查看我的主页啦&#xff01;&#x1f447;&#x…...

2.8、下拉刷新与上拉加载

页面的下拉刷新与上拉加载功能在移动应用中十分常见,例如,新闻页面的内容刷新和加载。这两种操作的原理都是通过响应用户的触摸事件,在顶部或者底部显示一个刷新或加载视图,完成后再将此视图隐藏。 实现思路 以下拉刷新为例,其实现主要分成三步: 监听手指按下事件,记录…...

java Web餐馆订单管理系统用eclipse定制开发mysql数据库BS模式java编程jdbc

一、源码特点 JSP 餐馆订单管理系统是一套完善的web设计系统&#xff0c;对理解JSP java 编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,eclipse开发&#xff0c;数据库为Mysql5.0&#xff0c;使…...

小程序从入门到入坑:事件系统

前言 哈喽大家好&#xff0c;我是 SuperYing&#xff0c;本文是小程序从入门到入坑系列的第 3 篇&#xff0c;将比较详尽的讲解 小程序事件系统 的相关知识点&#xff0c;欢迎小伙伴阅读。 读完本文您将收获&#xff1a; 了解小程序事件及基础使用。了解小程序事件分类及多种的…...

Windows蓝牙驱动开发之模拟HID设备(二)(把Windows电脑模拟成蓝牙鼠标和蓝牙键盘等设备)

by fanxiushu 2024-03-24 转载或引用请注明原作者 接上文,当我们建立了蓝牙链接请求之后,就该传输数据了, 其实传输数据比起上章阐述的创建SDP和建立连接要简单许多。 使用类型 BRB_L2CA_ACL_TRANSFER 的BRB请求,就可以实现接收和发送操作, 至于具体是接收还是发送,根据设…...

快速区分清楚图形渲染中的AABB,KD树和BVH这些概念

快速区分清楚图形渲染中的AABB&#xff0c;KD树和BVH这些概念 主要想形象去区分好这些术语&#xff0c;目的是扫盲&#xff0c;先开好坑&#xff0c;内容持续填充。 0.先摆出这些词的全称 AABB&#xff1a; 原名&#xff1a;axis aligned bounding box&#xff1b;中文直译名…...

Rust 的 HashMap 特定键值元素值的累加方法

在Rust中&#xff0c;如果你想要对HashMap中特定键对应的值进行累加操作&#xff0c;你需要首先检查该键是否已存在。如果存在&#xff0c;则取出其值&#xff0c;进行累加&#xff0c;然后将结果存回HashMap。如果不存在&#xff0c;则可能需要插入一个新的键值对&#xff0c;…...

Java后端项目性能优化实战-群发通知

背景 公司群发通知模块性能存在问题&#xff0c;我进行全面的系统调优&#xff0c;系统处理能力大幅提升。 原发送流程 优化后的发送流程 优化的点 说明&#xff1a;以下问题基本都是压测过程遇到的&#xff0c;有些问题普通的功能测试暴露不了。优化目标&#xff1a;保证高…...

5、Jenkins持续集成-Maven和Tomcat的安装与配置

文章目录 一、Maven的安装与配置1、安装maven并配置环境2、全局工具配置关联jdk和maven3、添加Jenkins全局变量4、修改settings.xml文件5、测试是否配置成功二、Tomcat的安装与配置1、安装tomcat8+2、配置Tomcat用户角色权限3、测试是否配置成功一、Maven的安装与配置 在Jenki…...

Qt教程 — 3.7 深入了解Qt 控件: Layouts部件

目录 2 如何使用Layouts部件 2.1 QBoxLayout组件-垂直或水平布局 2.2 QGridLayout组件-网格布局 2.3 QFormLayout组件-表单布局 在Qt中&#xff0c;布局管理器&#xff08;Layouts&#xff09;是用来管理窗口中控件位置和大小的重要工具。布局管理器可以确保窗口中的控件在…...

自动驾驶的几种名词

1. 自适应巡航控制&#xff08;ACC&#xff09; 自适应巡航控制&#xff08;Adaptive Cruise Control&#xff0c;ACC&#xff09;是一种汽车驾驶辅助系统&#xff0c;它可以根据前方车辆的速度和距离自动调整车辆的速度&#xff0c;以保持与前车的安全距离。ACC系统由控制层和…...

华为全套企业管理资料合集(21专题)

华为全套企业管理资料合集-知识星球下载 1.绩效考核 华为内训绝密资料:绩效管理与绩效考核.ppt 华为绩效管理与绩效考核制度.docx 华为公司实用性各种绩效图表汇总.doc 华为公司考勤管理制度.doc 华为IPD模式中跨部门团队成员的考核激励制度.doc 2.企业管理 华为公司人力资源…...

Ctrl+R 运行xxx.exe,发现有如下问题.

CtrlR 运行xxx.exe,发现有如下问题. (1)找不到Qt5Core.all,Qt5Cored.dll,Qt5Gui.dll,Qt5Guid.dll,Qt5Widgets.all,Qt5Widgetsd.dll? (2)之后找不到libwinpthread-1.dll 从这个目录拷贝相应的库到运行xx.exe目录下 方法二:将库路径添加到系统PATH环境变量里: 在Path中添加路…...

手撕 K-Means

1. K-means 的原理 K-means 是一种经典的无监督学习算法&#xff0c;用于将数据集划分为 kk 个簇&#xff08;cluster&#xff09;。其核心思想是通过迭代优化&#xff0c;将数据点分配到最近的簇中心&#xff0c;并更新簇中心&#xff0c;直到簇中心不再变化或达到最大迭代次…...

PDF 转 HTML5 —— HTML5 填充图形不支持 Even-Odd 奇偶规则?(第一部分)

在填充 PDF 中的图形时&#xff08;以及许多其他技术中&#xff09;&#xff0c;你可以选择使用 Even-Odd&#xff08;奇偶&#xff09; 或 Non-Zero&#xff08;非零&#xff09; 填充规则。 对于那些已经在想“你在说啥&#xff1f;”的朋友&#xff0c;别担心&#xff0c;我…...

如何使用插件和子主题添加WordPress自定义CSS(附:常见错误)

您是否曾经想更改网站外观的某些方面&#xff0c;但不知道怎么做&#xff1f;有一个解决方案——您可以将自定义 CSS&#xff08;层叠样式表&#xff09;添加到您的WordPress网站&#xff01; 在本文中&#xff0c;我们将讨论您需要了解的有关CSS的所有知识以及如何使用它来修…...

uni-app 如何实现选择和上传非图像、视频文件?

在 uni-app 中实现选择和上传非图像、视频文件&#xff0c;可根据不同端&#xff08;App、H5、小程序&#xff09;的特点&#xff0c;采用以下方法&#xff1a; 一、通用思路&#xff08;多端适配优先推荐&#xff09; 借助 uni.chooseFile 选择文件&#xff0c;再用 uni.upl…...

大模型模型部署和暴露接口

创建环境 激活案件 安装相关依赖 conda create -n fastApi python3.10 conda activate fastApi conda install -c conda-forge fastapi uvicorn transformers pytorch pip install safetensors sentencepiece protobuf 新建文件夹 mkdir App cd App touch main.py 复制代码…...

Pycharm中添加不了新建的Conda环境(此篇专门给Daidai写的)

安装好了Conda之后&#xff0c;在系统终端也创建好Conda环境&#xff0c;一切显示正常&#xff0c;但在Pycharm中添加不了新建的Conda环境&#xff0c;显示“Conda executable is not found” 解决“Conda executable is not found” conda环境新建如下 D:/Programs/anacond…...

Linux文件系统详解:从入门到精通

无论是开发高性能应用还是进行系统级编程&#xff0c;文件系统都是我们必须掌握的基础知识。今天&#xff0c;我将带大家深入浅出地了解Linux文件系统的核心概念和工作原理。 一、Linux文件系统概述 Linux文件系统是操作系统中负责管理持久存储设备上数据的子系统。它不仅仅是…...

【p2p、分布式,区块链笔记 MESH】Bluetooth蓝牙通信拓扑与操作 BR/EDR(经典蓝牙)和 BLE

目录 1. BR/EDR&#xff08;经典蓝牙&#xff09;网络结构微微网&#xff08;Piconet&#xff09;散射网&#xff08;Scatternet&#xff09;蓝牙 BR/EDR 拓扑结构示意图 2. BLE&#xff08;低功耗蓝牙&#xff09;网络结构广播器与观察者&#xff08;Broadcaster and Observer…...

placeholder不显示and模板字符串无效

一、placeholder"请输入"不显示请输入&#xff1f; input框里写了placeholder为什么不显示呢&#xff1f; 检查代码&#xff0c;input是否有初始值 在 Vue.js 中&#xff0c;v-model 是双向绑定的语法糖&#xff0c;它会动态更新输入框的 value。如果绑定的数据有初…...