前端

vue3封装一个通用的数据字典选择。支持v-model双向帮定值,支持change事件,支持传递提示语placeholder

代码如下: <template> <el-select v-model="innerValue" @change=&quo...

前端 2025-03-27 浏览(35 作者( TeachingNote )

通过vue-cli命令行创建uni-app项目。调试微信小程序,vscode 开发 uni-app,微信小程序基础开发模板,基础架子搭建。vue3读取环境变量配置,编译配置

tip:搭建的基础开发模板放了一份在FastAdmin.NET里边的FastAdmin.Mobile.Template.Pure,方便直接拉下来使用,不...

前端 2025-03-18 浏览(208 作者( 剑轩 )

vue uni-app 微信小程序 安装常用依赖

[TOC]安装sass 依赖cnpm install sass sass-loader --save-dev 或者 pnpm install sass sass-loader --save-d...

前端 2025-03-18 浏览(97 作者( TeachingNote )

uni-app 开发 微信小程序 v-html会生成 rich-text,不好设置图片样式,给图片的最大宽度设置100%

方案一:通过修改数据源添加内联样式(推荐)在绑定v-html的内容中,直接为标签添加内联样式style=”max-width:1...

前端 2025-03-18 浏览(108 作者( TeachingNote )

vscode ,vue3引入组件报错:Module .... has no default export

原因:在 Vue 3 中,当你在 <script setup> 中编写组件时,默认情况下,组件不是通过 default export 导出...

前端 2025-03-17 浏览(159 作者( TeachingNote )

vue3 element-plus 表格 day.js 时间格式化显示

引入day.js import { dayjs } from 'element-plus' 显示时间 <el-table-column prop="create...

前端 2025-03-14 浏览(134 作者( TeachingNote )

生成通用的边距样式,外边距、内边距全局样式。字体大小全局样式。通用全局样式封装

样式代码如下: <style lang="scss"> /* 外边距、内边距全局样式 ----------------------...

前端 2025-03-13 浏览(119 作者( TeachingNote )

element plus 的Tree 懒加载。省市县镇村树形懒加载

这里的示例代码是做的县镇村tree懒加载联动数据。接口数据这些换成自己的就行。有根据countyId查询区县下面镇...

前端 2025-03-12 浏览(119 作者( 剑轩 )

样式中找到第n个子元素

代码如下: .sta-training-item:nth-child(1){ background-image: url('~@/static/imgs/teacher-center/...

前端 2025-02-28 浏览(183 作者( TeachingNote )

uni-app 微信小程序,flex 实现内容元素垂直与水平居中

效果如下,中间那块内容垂直与水平居中: [TOC]代码如下:<template> <view class="trainin...

前端 2025-02-28 浏览(208 作者( 忆点点 )

不同分辨率自适应布局。vue 搜索栏,操作按钮自适应布局

标签<div class="toolbar"> <div> <el-button type="primary&quot...

前端 2025-02-27 浏览(167 作者( 忆点点 )

vue3 读取excel 文件内容 返回json。vue3 导入excel

在 Vue 3 中读取 Excel 文件并将其内容转换为 JSON 格式,你可以使用一些第三方库,比如 xlsx 和 file-saver。下...

前端 2025-02-25 浏览(243 作者( 忆点点 )

vue 弹窗里边的数据更新更改修改后如何刷新主页面内容,弹窗里边的内容是单独的组件。子组件执行父组件方法

其实在封装的组件弄一个事件即可,不然在关闭弹窗的时候刷新数据不科学,这样每次都要刷新数据。 子组件,弹窗...

前端 2025-02-22 浏览(241 作者( 风清月 )

vue3 如何修改集合中的某一个属性。vue修改某个list对象数组中的字段值

比如我有一个对象集合,我只想修改这个集合里边某个对象的checkype属性,封装一个方法可以通过传递一个id来修改...

前端 2025-02-21 浏览(276 作者( 风清月 )

vue, vue3 Tinymce 图片上传 。复制粘贴图片

[TOC]上传图片,首先要启用图片插件在plugins参数中把image加进去 在工具栏显示图片工具按钮,在toolbar参数中...

前端 2025-02-19 浏览(290 作者( 剑轩 )

总结 Vue3 的 13 种传参通信方式

props 父传子defineEmits 子传父mitt 兄弟组件传参$attrs (爷孙)refsv-model (双向)provide/inject (多层)路由...

前端 2025-02-14 浏览(310 作者( TeachingNote )

vue3 微信小程序 uniapp图片上传,图片转base64,base64转图片

vue3 微信小程序 uniapp 图片上传uni-app中上传图片可以使用方法uni.uploadFile:uni.uploadFile官方文档:https:...

前端 2025-02-13 浏览(329 作者( TeachingNote )

微信小程序设置为不缓存

设置—>通用设置—>找到:使用新版文件监听模块,把勾勾去掉即可。

前端 2025-02-12 浏览(255 作者( TeachingNote )

vue3 微信小程序,uni-app 签字版插件sp-sign-board。上传图片

插件地址:https://ext.dcloud.net.cn/plugin?id=14966 文档:https://sonvee.github.io/sv-app-docs/docs-git...

前端 2025-02-10 浏览(277 作者( TeachingNote )

vue3 微信小程序,uni-app 基本模板

代码如下: <template> <view class="index-container"> 6666 </view>...

前端 2025-02-08 浏览(293 作者( TeachingNote )

vue3 ts uni-app 微信小程序 抽屉菜单的使用。抽屉菜单的打开关闭。基本模板。解决抽屉菜单的滚动穿透

代码如下: <template> <!-- 解决滚动穿透 --> <page-meta :page-style="'...

前端 2025-02-07 浏览(268 作者( TeachingNote )

vue3 vite ts 使用 uni-app 微信小程序 引入组件。引入扩展组件,引入下载的组件

引入组件还是直接引用即可: import zbTab from '@/components/zb-tab/zb-tab.vue' import moduleItem...

前端 2025-02-07 浏览(284 作者( TeachingNote )

vue3 ts uni-app 微信小程序 生命周期函数。uni-app 动态修改页面的title,header里边的title

vue3 ts uni-app 生命周期函数import { onLoad, onShow,onUnload } from '@dcloudio/uni-app' onLoad...

前端 2025-02-06 浏览(319 作者( TeachingNote )

使用grid布局实现每行2个,间距20px,每项占用间距之后剩下宽度的50%

如果直接这样设置: grid-template-columns: repeat(2, 50%); grid-column-gap: 20px; 他会影响整体的宽度,...

前端 2025-02-05 浏览(299 作者( TeachingNote )

uni-app 微信小程序 修改页面的颜色

修改单个页面背景颜色方法一:在页面里边直接给page设置样式<style lang="scss"> /* 为页面...

前端 2025-01-18 浏览(377 作者( 小见 )

uni-app 项目 vue3 st vite 版本 怎么配置h5启动的端口号

代码如下: import { defineConfig } from 'vite'; import uni from '@dcloudio/uni-vite-plugin&...

前端 2025-01-14 浏览(270 作者( TeachingNote )

vue,vue3 js,ts实现类似a标签的锚点功能,因为vue路由导致直接html的锚点功能失效

因为vue路由导致直接html的锚点功能失效,可以用js来实现,代码如下: const toAnchorPoint = (location: s...

前端 2025-01-13 浏览(228 作者( TeachingNote )

.net , c# 生成guid 不需要中间的短斜杠

代码如下: Guid.NewGuid().ToString("N")

前端 2025-01-06 浏览(359 作者( TeachingNote )

element ui admin 如何点击按钮关闭当前菜单。vue-element-admin关闭当前标签页。编辑文章或者编写文章后返回上一页

核心代码如下: // 调用全局挂载的方法(vuex中封装的方法),关闭当前页 this.$store.dispatch("ta...

前端 2025-01-06 浏览(363 作者( TeachingNote )

axios发送一个Post请求,发送一个类似postman中的x-www-form-urlencoded 格式参数

在 Postman 中,x-www-form-urlencoded 是一种编码格式,它允许你将表单数据以键值对的形式发送到服务器,类似于...

前端 2024-12-27 浏览(467 作者( 风清月 )

axios发送一个Post请求,把json参数使用Form Data的形式进行传递

在 Vue 3 中使用 Axios 发送一个 POST 请求,并且以 FormData 的形式传递参数,你可以使用 FormData 对象来构建...

前端 2024-12-27 浏览(624 作者( 风清月 )

element plus table 表格,开启多选,增加复选框。设置忽略可选属性。获取选择的值

element plus table 表格,要开启多选非常简单,手动添加一个 el-table-column,设 type 属性为 selection 即可...

前端 2024-12-25 浏览(674 作者( TeachingNote )

vue3组件刷新,手动刷新组件,手动重新加载组件,类似reload方法

一般情况会封装一个refreshData来重新刷新数据,但是有些情况参数比较复杂,写这种刷新方法需要注意很多东西还要...

前端 2024-12-25 浏览(866 作者( TeachingNote )

修改element plus Carousel 走马灯 改指示器的样式,变为小圆点的效果。修改切换箭头的样式,位置,颜色等

代码如下: <!-- 修改element plus Carousel 走马灯 改指示器的样式,变为小圆点的效果。 以及切换箭...

前端 2024-12-23 浏览(620 作者( TeachingNote )

vue 样式穿透写法

方法一:使用 ::v-deep示例代码如下: <style scoped="scoped" lang="scss"> ...

前端 2024-12-23 浏览(452 作者( TeachingNote )

ts实现动态拼接字符串,实现类似 C# 的 string.Format的格式化字符串。ts,js动态给拼接字符串提供参数

模板是这样的:”于${0}通过${1}课程体系《${2}》课程授课”对于这种格式的模板字符串,可以使用一个简单的替换...

前端 2024-12-19 浏览(534 作者( TeachingNote )

ts实现面向对象编程,定义属性,方法,构造函数,私有方法,以及引用类,实例化类等。vue3使用ts对象

[TOC]ts实现面向对象编程,定义属性,构造函数等基础使用在 TypeScript 中,你可以使用类和面向对象编程(OOP)...

前端 2024-12-18 浏览(781 作者( TeachingNote )

vue3使用canvas进行绘图的时候,动态实现绘制文字居中。实现绘制文字的时候设置间距。有文字间距的情况下动态实现居中

比如我绘制两个字,drawText(‘李白’, 32,’Arial’, ‘#062466’, 516, 335),最后两个参数是x,y坐标。这样可...

前端 2024-12-17 浏览(595 作者( 剑轩 )

Canvas在绘制文字的时候,实现文字的水平间距调整,类似css里边的letter-spacing

在Canvas上绘制文字时,虽然Canvas的2D渲染上下文(CanvasRenderingContext2D)没有直接提供类似于CSS中letter-s...

前端 2024-12-16 浏览(517 作者( TeachingNote )

vue3 使用Canvas对图像进行编辑,图片里边添加文字,导出为图片,导出图片的时候按照一定比例进行导出

比如我想把原图为35082480的缩小三倍变成1169827下编辑,这个时候我把Canvas的宽高设置成1169827编辑后,后导出...

前端 2024-12-16 浏览(528 作者( TeachingNote )

uniapp plus.runtime.install 安装失败

APP 权限配置添加"<uses-permission android:name=\"android.permission.REQUEST_INSTALL_PACKAGES...

前端 2024-12-13 浏览(552 作者( 人生若只如初见 )

uniapp 应用热更新,进度条/权限

/** * 检查安装应用权限 */ checkInstallPermission() { return new Promise((resolve, reject) =&gt...

前端 2024-12-13 浏览(533 作者( 人生若只如初见 )

vue3 图片上传,文件上传,视频上传。图片预览,视频预览。

直接调用接口上传参考:https://www.tnblog.net/notebook/article/details/8495[TOC]基础的图片上传,文件上传,...

前端 2024-12-09 浏览(712 作者( 剑轩 )

vue3 element plus 常用提示信息,提示框

引入相关方法import { ElMessageBox, ElMessage } from 'element-plus' 常用提示框写法ElMessage.warni...

前端 2024-12-09 浏览(629 作者( 小可爱 )

vue3 实现div滚动到一定位置就固定他,实现一侧滚动到某个位置就固定,实现滚动条滚动到一边的最底部就固定

在vue2以及普通页面里边使用参考:https://www.tnblog.net/aojiancc2/article/details/1273本来在vue中最好不要...

前端 2024-12-09 浏览(679 作者( TeachingNote )

vue3 使用Transition实现一个侧边菜单

从左边弹出<template> <div> <button @click="showMenu = !showMenu"&g...

前端 2024-12-04 浏览(491 作者( TeachingNote )

vue3实现展开更多,加载全部

[TOC]方法一:分成两份来展示,一份显示出来,一份隐藏掉,点击加载全部在把隐藏的显示出来封装的组件的代码如...

前端 2024-12-03 浏览(518 作者( TeachingNote )

不同宽度下不同分辨率下的自适应布局样式写法

使用media可以在不同宽度下写不同的样式,代码如下 <style> @media (min-width: 1024px) { .about { ...

前端 2024-12-03 浏览(527 作者( TeachingNote )

vue3 在线签字,生成一张图 。重置的时候保留背景颜色

主要使用插件vue-esign,官方文档:https://github.com/JaimeCheng/vue-esign [TOC]一:添加引用cnpm install vu...

前端 2024-12-02 浏览(623 作者( TeachingNote )

最近天气

好句分享

在情感关系里沟通是最重要的,喜欢开心要告诉对方,讨厌生气也要让对方明白,这样双方才能把握好分寸让彼此都能轻松自在,所以爱绝不是只为满足自己的需求任性妄为,爱的基础是尊重,没有这个就只是打着爱的幌子相互伤害。因为有你满心欢喜,也因为有你满是遗憾。

技术交流