全局 组件vite vue3
day27 初识日志收集组件Fluentd-日志收集组件Fluentd高级配置 （9.6-9.7）
9.6-1-日志收集组件Fluentd高级配置(1) 一、配置文件 在 Fluentd 的配置文件中，有几个常用的关键字和组件，包括 source 、 match 、filter 、 system 、 label 和 @include 。 source ：用于定义 Fluentd 接收数据的来源。 ......
day26 海量数据下的EFK架构优化升级-初识日志收集组件Fluentd （9.4-9.5）
9.4-1-海量数据下的EFK架构优化升级(1) 一、数据背景 在海量数据场景下，日志管理和分析是一项重要任务。为了解决这个问题，EFK 架构（Elasticsearch + Fluentd + Kibana）已经成为流行的选择。然而，随着数据规模的增加，传统的 EFK 架构可能面临性能瓶颈和可用性 ......
For循环结束后才会执行onAreaChange组件区域变化事件？？
一开始利用WaterFlow容器写了个瀑布流，无奈瀑布流的滚动条和页面Scroll滚动冲突，于是乎想自己是实现一个瀑布流效果 思路大致如下： 1，分成两列，（两个Column），不给固定高度，让子元素自行把父容器撑大 2，每次添加数据时，找到相比较当前的2个容器高度‘矮’的那一个，(Height小的 ......
# vue3 插槽 slot 使用
vue3 插槽 slot 使用 在 Vue3 中，插槽（slot）是一种重要的组件复用和内容分发机制。通过使用插槽，可以让组件更加灵活和具有可复用性，在不同的地方渲染不同的内容，同时保证相同的样式。 插槽资料 官网介绍：https://cn.vuejs.org/guide/components/sl ......
程序启动添加全局异常捕获和Dump日志记录
Dump日志记录 /// <summary> /// 功能描述：程序全局异常捕获Dump文件记录 /// </summary> public static class MiniDump { [Flags] public enum Option : uint { // From dbghelp.h: ......
vue3 表单封装遇到的一个有意思的问题
前言 最近在用 vue3 封装 element 的表单时遇到的一个小问题，这里就简单记录一下过程。话不多说直接上代码！！！ 正文 部分核心代码 import { ref, defineComponent, renderSlot, type PropType, type SetupContext } ......
vue3 vue-cropper实现图片裁剪+上传功能（组件封装使用）
效果（CV 即用） 1.安装引入 vue-cropper（官网）官网地址 npm install vue-cropper@next import 'vue-cropper/dist/index.css' import { VueCropper } from "vue-cropper"; 2. 全局引 ......
一个公共的swiper组件，swiper版本是3.4.2
import { getBannerList } from "@/utils/request/banner";import Swiper from "swiper";import {WOW} from "wowjs";export default { data() { return { banner ......
【源码系列#05】Vue3响应式原理（Ref）
proxy 只接受对象入参，所以我们需要 ref 来解决值类型的数据相应。如果传入 ref 的是一个对象，内部也会调用 reactive 方法进行深层响应式转换 ......
el-upload上传组件
使用el-upload上传文件 <template> <div> <el-upload action="/upload" :on-success="handleSuccess" :on-error="handleError" :before-upload="beforeUpload" > <el-b ......
react ant-mobile的input组件，使用ref实现失焦方法
// 设置ref<Input ref={inputRef} placeholder='信息保密，仅用于投保' className='pos-app-phone tkzx-rr-block' clearable type='tel' maxLength='11' onChange={(val) => ......
vue3 setup函数之数据
setup中定义方法： export default { name: 'App', setup(){ //定义方法 function edit() { } return { //方法与数据，必须要返回出去，不然不起作用。 edit } } } setup中ref函数定义基本数据类型与对象数据类型： ......
java中匿名类，Bean规范，全局变量
实现看见一个人，我们对它说hello public class study01 { public static void main(String[] args) { Me me = new Me(); me.SayHello(new ZhangSan()); } } // 定义了一个抽象类； abs ......
Vue3自定义一个Hooks，实现一键换肤
核心 使用 CSS 变量, 准备两套 CSS 颜色, 一套是在 light 模式下的颜色,一套是在 dark 模式下的颜色 dark 模式下的 CSS 权重要比 light 模式下的权重高, 不然当我们给 html 添加自定义属性[data-theme='dark']的时候, dark 模式权重比 ......
uniapp使用富文本组件editor获取不到data内数据的问题
vue2 在使用 uniapp 官方提供的 editor 富文本编辑器组件时，代码需求需要获取到富文本组件内的输入值并通过接口发送给后端，在editorContext.getContents内无论如何都无法将获取到的输入值存入data(){}内，最后通过修改this指向成功获取。 ......
vue通过elementUI组件实现图片预览效果 点击按钮后触发
<el-image ref="elImage" style="width: 0; height: 0;" :src="bigImageUrl" :preview-src-list="logicImageList"></el-image> detialClick(img) { this.$nextTi ......
界面组件DevExpress WinForms v23.2新版亮点：支持辅助工具、UI自动化
DevExpress WinForms拥有180+组件和UI库，能为Windows Forms平台创建具有影响力的业务解决方案。DevExpress WinForms能完美构建流畅、美观且易于使用的应用程序，无论是Office风格的界面，还是分析处理大批量的业务数据，它都能轻松胜任！ DevExpr ......
富文本编辑器wangEdiotr，编辑表格后，重新打开组件报错Error in callback for watcher “value“: “Error: Cannot find a descenda（json爆红）
报错内容 原因：每次打开对话框，editor组件只创一次，关闭对话框也不会被销毁。所以：只要每次打开都重新渲染Editor组件就好了。 解决办法：在上加上v-if <editor v-model="form.noticeContent" :min-height="192" v-if="open"/> ......
组件
一般将App.vue作为根组件，您将vue2_demo和vue3_demo等作为子组件导入并注册 // App.vue <script> import Vue2Demo from './components/vue2_demo.vue'; import Vue3Demo from './compon ......
react+antd-mobile+vite移动端H5前端项目
React+antd-mobile+vite ($\color{red} {注意：} $)待解决问题 （1）高版本路由第一次切换tab跳路由会出现闪烁,路由切换会延迟导致tab无法触发active(预计和缓存组件不更新路由参数有关) （2）使用ReactDOM.createRoot实例化项目，在结合 ......
Angular 17+ 高级教程 – Component 组件 の ng-template
前言 Angular 的动态组件博大精深, 没有认真学一下的话, 在开发中经常会掉坑里. 所以这篇大家要认真看一下哦. 参考 angular2 学习笔记 ( Dynamic Component 动态组件) 早年我写的文章 Angular 学习笔记 (动态组件 & Material Overlay & ......
vue3+vant+vite移动端H5前端项目
vue3+vant4 项目地址 vue项目演示 react项目演示 react项目代码:react项目代码 环境版本 nuc 16.10.9 (ncu -u) nvm 1.1.11 node 20.0.0 npm 9.6.4 项目重要知识点 1. 采用 vue3 + vite + pinia 2.可 ......
Vite配置了proxy，查看代理接口地址
开发环境VIte配置了proxy，在控制台看不到实际请求的URL 可以在proxy使用byPass() 因为无法将其添加到请求头中，使用加到响应头方便查看 '/api': { target: env.VITE_NODE_ENV 'prod' ? 'https://***.com' : `https: ......
Vue3使用vue-video-player组件
1.安装依赖（亲测5.0.1版本可用，最新版本会找不到'vue-video-player/src/custom-theme.css'这个样式） yarn add vue-video-player@5.0.1 2.main.js里增加以下代码 1 import VideoPlayer from 'vu ......
React函数式组件避免无用渲染的方案
在class组件中可以使用shouldComponentUpdate钩子函数，但是函数式组件中是没有这种钩子函数的，那么在函数式组件中来达到类似的效果呢? 答案是：React.Memo,如以下使用案例： // 父组件 const [values, setValues] = useState({ a: ......
vue3 - iframe 添加 click事件 -解决
没法在 iframe 元素直接添加 @click 回调 ，会无效的 同时，想要添加点击事件，需要在 iframe 加载完成后才能绑定事件，否则也是无效 因此，正确的绑定办法是，在iframe 绑定 @load 然后 const load = (v: boolean) => {if (!v) { // ......
记录一次libgbm库不匹配导致的grafanan渲染组件运行失败问题
背景： 公司使用的grafana版本比较老5.x版本，最近做了一次升级至10.x版本，升级后发现原来的图片渲染功能不可用， 查阅资料发现：https://grafana.com/docs/grafana/latest/setup-grafana/image-rendering/ 那说明需要单独安装此 ......
vue3教程（1 快速入门）
一、Vue 是什么？ Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 渐进式框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、响应式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vu ......
# vue3 接入 Element Plus
vue3 接入 Element Plus vue3 发布已经很久了，官方也已经发布公告，自2023年12月31日起停止对 vue2 版本的维护更新，因此，vue3 正式登上了历史的舞台。组件库一直是前端开发的利器，减少了开发者开发复杂度，提高开发效率，在 vue2 中，最常使用的是 element- ......