排名
1
文章数
15030
总访问量
216.3万
粉丝数
30
评论数
120
ts实现动态拼接字符串，实现类似 C# 的 string.Format的格式化字符串。ts,js动态给拼接字符串提供参数
模板是这样的：”于${0}通过${1}课程体系《${2}》课程授课”对于这种格式的模板字符串，可以使用一个简单的替换函数来处理，而不需要复杂的正则表达式转义。下面是一个处理这种模板的示例函数：
function formatString(template: string, ...values: any[]): string {
return template.replace(/\$\{(\d+)\}/...
ts实现面向对象编程，定义属性,方法，构造函数，私有方法，以及引用类，实例化类等。vue3使用ts对象
[TOC]ts实现面向对象编程，定义属性，构造函数等基础使用在 TypeScript 中，你可以使用类和面向对象编程（OOP）的概念来实现类似于 C# 的功能，包括构造函数、属性和方法。TypeScript 是 JavaScript 的一个超集，它添加了静态类型、类、接口等概念，使得代码更加健壮和可维护。
下面是一个简单的示例，展示如何在 ...
Canvas在绘制文字的时候，实现文字的水平间距调整，类似css里边的letter-spacing
在Canvas上绘制文字时，虽然Canvas的2D渲染上下文（CanvasRenderingContext2D）没有直接提供类似于CSS中letter-spacing的属性来调整文字的水平间距，但你可以通过一些技巧来实现类似的效果。
一种常见的方法是手动计算每个字符的宽度，并在它们之间添加额外的空间。这通常涉及到使用measureText()方法来获取文本的...
mysql 使用命令添加列，包含类型，注释，默认值等
代码如下：
ALTER TABLE training_subprogram
ADD COLUMN IsMustDo TINYINT DEFAULT 0 COMMENT '是否必做（用于公开类型的设置），0不是必做，1必做';
vue3 实现div滚动到一定位置就固定他，实现一侧滚动到某个位置就固定，实现滚动条滚动到一边的最底部就固定
在vue2以及普通页面里边使用参考：https://www.tnblog.net/aojiancc2/article/details/1273本来在vue中最好不要去用jquery的，可以直接去监听滚动条的事件来实现的，这会比较忙就直接用一下jquery了。
<script setup lang="ts" name="labroomindex">
import { reactive, onMounted...
vue3 使用Transition实现一个侧边菜单
从左边弹出<template>
<div>
<button @click="showMenu = !showMenu">打开菜单</button>
<transition name="slide">
<div v-if="showMenu" class="side-menu">
<!-- 菜单内...
vue3实现展开更多，加载全部
[TOC]方法一：分成两份来展示，一份显示出来，一份隐藏掉，点击加载全部在把隐藏的显示出来封装的组件的代码如下：
<template>
<div class="completeUerList-container">
<div class="cu-ct-title">
{{ props.title }}
</div>...
不同宽度下不同分辨率下的自适应布局样式写法
使用media可以在不同宽度下写不同的样式，代码如下
<style>
@media (min-width: 1024px) {
.about {
min-height: 100vh;
display: flex;
align-items: center;
}
}
</style>
VUE, JS Base64上传图片或文件。Base64 编码的图片转成二进制图片。封装的直接调用接口的图片上传。canvas生成的图片上传。blob类型的图片文件上传。vue3签字图片上传
代码如下：
// Base64 编码的图片转成二进制图片
const base64ToImg = (base64String: string) => {
const byteString = window.atob(base64String.split(',')[1])
const mimeString = base64String.split(',')[0].split(':')[1].split(';')[0]
...
vue3 在线签字,生成一张图 。重置的时候保留背景颜色
主要使用插件vue-esign,官方文档：https://github.com/JaimeCheng/vue-esign
[TOC]一：添加引用cnpm install vue-esign
二：简单使用先引用
import vueEsign from 'vue-esign'
就可以直接使用了
<vue-esign ref="esign" :width="800" :height="300"/>
在页面里...
flex实现一行尽可能的容纳更多子项，且每项的内容自适应宽度，自适应内部文字的宽度
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flexbox Layout Example</title>
<...
element plus tree 把数据源里边的所有isShowMenu都赋值为false，在树节点右边增加操作按钮，只显示当前点击节点的菜单
效果图：
代码如下：
<template>
<div class="module-manage-container">
<div style="display: flex">
<el-card class="box-card" style="width: 300px; margin-right: 10px">
<el-scrollba...
tree 树形递归解析算法，处理特殊的根节点条件，特定的顶级顶层条件。树形获取顶级下面所有的子级id
[TOC]一般情况下的递归解析树形参考：https://www.tnblog.net/aojiancc2/article/details/4785这个是sqlsugar封装的关于树形相关的方法https://www.donet5.com/home/doc?masterId=1&typeId=2311
树形递归解析算法，处理特殊的根节点条件，特定的顶级顶层条件在sqlsguar中有一个这样的表
public class Tree
...
sqlsugar 树型递归查询。UtilMethods.BuildTree 用法
sqlsugar 树型递归查询官方文档：https://www.donet5.com/home/doc?masterId=1&typeId=2311
UtilMethods.BuildTree 用法public class Tree
{
[SqlSugar.SugarColumn(IsPrimaryKey = true)]
public int Id { get; set; }
public string Name { get; set; }
public int ParentId { get; s...
element plus 图标按钮，按钮加图标。直接显示图标，修改图标大小
https://element.eleme.cn/#/zh-CN/component/button 官网这个图标按钮我这样放进去不行，显示不出来，有可能是版本问题
我这里需要这么使用,增加一个icon的绑定：
<el-button type="success" :icon="Plus" size="default">添加培训项目</el-button>
还需要给对应的...
.net core 获取配置文件， 在其他层获取配置文件，在任意层里边获取配置文件
首先，在你的appsettings.json文件中添加你需要的配置项{
"SomeSetting": "Some value"
}
项目中引用Microsoft.Extensions.Configuration.Json包<ItemGroup>
<PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="6.0.0"...
js实现分组,vue中 js实现分组
封装根据teacherId分组的方法：// 根据老师id
groupByTeacherId(items) {
return items.reduce((groups, item) => {
const key = item.teacherId;
if (!groups[key]) {
groups[key] = {
teacherName: item.teacherName,
items: [],
};
}
groups[key].i...
element ui table 表格行颜色自定义,单元格颜色自定义。背景颜色自定义。风格自定义
[TOC]实现效果一效果图
代码如下template:<template>
<div class="emergencyEvents-container">
<el-table :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" :row-style="rowStyle">
<...
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 ：渝ICP备18016597号-1
网站信息：2018-2024TNBLOG.NET
技术交流：群号656732739
联系我们：contact@tnblog.net
公网安备：
50010702506256
50010702506256
欢迎加群交流技术