Antdesign 页面中微信自定义菜单编辑的实现

已于 2024-09-11 16:58:26 修改
阅读量239 收藏
点赞数 5
分类专栏： DeAdmin 文章标签： 前端
于 2024-09-11 16:52:45 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/getElement/article/details/142143957
版权

微信自定义菜单可视化编辑的实现

组件结构示例图

组件先分成左右两部分

1.左侧菜单预览

2.右侧为form表单编辑页面

3.左侧主菜单包含子菜单

拖拽使用dndkit库

设置formMenu为右侧form的值，每次左侧选择主菜单或子菜单都进行动态设置

const [formMenu, setFormMenu] = useState<wxMenu>();

然后监听右侧form值变动信息后 保存左侧菜单值

效果图

开源项目地址 

Github

项目在线体验地址

DeAdmin在线体验

getElement
关注
专栏目录
Kubernetes(K8S) 入门进阶实战完整教程
JustinMars的博客
03-15 2955
Kubernetes详细教程 1. Kubernetes介绍 1.1 应用部署方式演变 在部署应用程序的方式上，主要经历了三个时代： 传统部署：互联网早期，会直接将应用程序部署在物理机上 优点：简单，不需要其它技术的参与 缺点：不能为应用程序定义资源使用边界，很难合理地分配计算资源，而且程序之间容易产生影响 虚拟化部署：可以在一台物理机上运行多个虚拟机，每个虚拟机都是独立的一个环境 优点：程序环境不会相互产生影响，提供了一定程度的安全性 缺点：增加了操作系统，浪费了部分资源 容器化部署：
【VirtualBox中Ubuntu-22.04下用国内源安装minikube1.33.1】
Q595128841的博客
07-20 680
还记得上面我们已经安装了kubectl、kubeadm吗，此时我们只需要将安装好的命令链接到minikube目录就好了，从报错信息我们知道了要链接的目录是。你已经安装好了一个干净的Ubuntu操作系统，并且apt软件源已经更换到阿里云软件源。此时你应该是启动不成功，出现以下错误，标识kubectl、kubeadm下载失败了。再次使用上面的命令启动依次，此时会很快输出。至此Minikube集群创建成功。
The connection to the server localhost:8080 was refused - did you specify the right host or port?
最新发布
JCWang的博客
08-24 269
1.将master 节点中 /etc/kubernetes/admin,conf拷贝到需要运行的服务器的 /etc/kubernetes 目录中。如果在node节点上执行kubectl get node报。2.在对应的服务器上配置环境变量。
Kubernetes 入门&进阶实战-转
水木米
06-13 544
本文组织方式：1. K8S 是什么，即作用和目的。涉及 K8S 架构的整理，Master 和 Node 之间的关系，以及 K8S
Kubernetes----Kubernetes学习从入门到实战循序渐进系列篇
redrose2100的博客
05-24 508
Kubernetes----Kubernetes的产生背景与简介 Kubernetes----Kubernetes组件简介及相关概念 Kubernetes----Kubernetes常用插件简介 Kubernetes----Kubernetes集群环境搭建 Kubernetes----Kubernetes集群环境配置在Node节点或普通用户使用kubectl命令 Kubernetes----Kubernetes中Namespace名字空间的简介与应用 Kubernetes----..
《Kubernetes进阶实战》第一章《Kubernetes系统基础》
紫色飞猪
01-11 3071
开发模式从瀑布式（Waterfall）到敏捷（Agile）再到精益（Lean）,甚至是与QA和Opeartions融合的Devops 应用程序架构从单体（monolithic）模型到分层模型再到微服务 部署及打包方式从面向物理机到虚拟机再到容器 应用程序的基础架构从自建机房到托管再到云计算 以Docker为代表的容器技术的出现，终结了Devops中交付和部署环节因环境，配置及程序本身的不同...
新书推荐 |《Kubernetes进阶实战》
华章IT官方博客
03-29 336
新书推荐《Kubernetes进阶实战》长按二维码了解及购买基于Kubernetes1.12，重点话题全面覆盖，具备大量实操案例，提供代码下载及配置清单编辑推荐1. 马哥教育CEO马哥（...
Kubernetes 入门&进阶实战
j简说Linux的博客
11-17 493
再打个形象的比喻，在同一个 Pod 里的几个 Docker 服务/程序，好像被部署在同一台机器上，可以通过 localhost 互相访问，并且可以共用 Pod 里的存储资源（这里是指 Docker 可以挂载 Pod 内的数据卷，数据卷的概念，后文会详细讲述，暂时理解为“需要手动 mount 的磁盘”）。到这里，相信你已经对 K8S 究竟是做什么的，有了大概认识。笔者一边写文章，一边查阅和整理 K8S 资料，过程中越发感觉 K8S 架构的完备、设计的精妙，是值得深入研究的，K8S 大受欢迎是有道理的。
kubernetes 学习日志 – pod介绍
01-07
1、pod概念  1.1 分类  自助式pod（一旦死亡无法恢复）  控制器管理的pod  1.2 pod介绍  1.2.1 container  pause：基础容器，同pod一同启动  其他容器： 共用pause的网络栈和存储卷  网络栈：pod中的容器...
kubernetes基础入门
09-27
Kubernetes的目标是为开发者提供一个统一的应用部署平台，使开发者可以轻松地将应用程序从本地开发环境转移到生产环境而无需修改代码。 **1.3 Kubernetes基本概念** - **Pod**: Pod是Kubernetes中最小的可部署单元...
kubernetes实战（套装共2册）
06-05
kubernetes实战（套装共2册） k8s kindle格式 pc、手机下个kindle客户端就能看，效果很好。
2021/02/15 Kubernetes进阶实践
qq_42227818的博客
03-08 630
第1章 ETCD数据访问 1.1 k8s在etcd中数据的存储 这个文件夹是静态文件，etcd是个静态pod，里面存储了K8S的所有数据 etcd是容器运行的 把etcdctl复制到宿主机 提示我们etcdctl环境变量没有设置，默认是v2版本 如果搭建高可用，etcd节点数和K8S的master的节点数是一致的 允许客户端去认证，下面是签发 的证书 需要三个，一个是跟证书，一个是跟证书签发的私钥，公钥 后面才是真正查询的，成员列表，以表的方式展现 etcd默认监听端口是23
ubuntu 18.04下minikube的安装
sunrj_niu的博客
11-04 1923
ubuntu 18.04下minikube的安装 第1步：更新系统 运行以下命令将所有系统软件包更新到最新版本： sudo apt-get update sudo apt-get install apt-transport-https sudo apt-get upgrade 第2步：下载minikube //你需要下载minikube二进制文件，我将二进制文件放在/usr/local/bin目录下，因为它位于$PATH中： wget https://storage.googleapis.com/
007.Kubernetes二进制部署Flannel
爱无止
11-16 321
一 部署flannel时光小说网 https://wap.youxs.org/ 1.1 安装flannel kubernetes 要求集群内各节点(包括 master 节点)能通过 Pod 网段互联互通。flannel 使用 vxlan 技术为各节点创建一个可以互通的 Pod 网络，使用的端口为 UDP 8472。 flanneld 第一次启动时，从 etcd 获取配置的 Pod 网段...
minikube启动连接报错
DoveSluo的博客
08-20 832
The connection to the server 192.168.99.100:8443 was refused - did you specify the right host or port? minikube重启无效 mac重启后生效 转问题单:https://github.com/kubernetes/minikube/issues/1498
kubectl使用minikube后报错The connection to the server localhost:8080 was refused
qq_30633489的博客
03-22 2012
按《Kubernetes in action》入门，在使用minikube start后，再执行minikube stop就会出现如下问题 $ kubectl get pod The connection to the server localhost:8080 was refused - did you specify the right host or port? 这个明显是配置错误，但是确认~/.kube/config没有问题。后来发现是因为minikube start的时候，将kubectl的co
minikube addons enable ingress 报错waiting for app.kubernetes.io/name=ingress-nginx pods: timed out
爱死亡机器人
03-30 8302
[root@control-plane ~]# more /tmp/minikube_addons_5e63cb8ceb2e7e06e33b8dd7a9dcbebc0ad5ec5a_0.log Log file created at: 2022/03/28 23:36:49 Running on machine: localhost Binary: Built with gc go1.17.7 for linux/amd64 Log line format: [IWEF]mmdd hh:mm:ss.uuu
Kubernetes深度解析：从基础到进阶
1. Kubernetes基本概念： - K8s集群（Kubernetes Cluster）：由多个称为节点（nodes）的服务器组成，每个节点都运行一个容器运行时环境，如Docker。 - 主控节点（Master Node）：负责集群的管理和调度，包括API...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值