思维导图插件--jsMind的使用

news2024/11/22 15:12:45

vue引入jsmind(右键菜单)_jsmind.menu.js-CSDN博客    第一版

vue-JsMind思维导图实现(包含鼠标右键自定义菜单)_jsmind 右键菜单-CSDN博客

// 新增节点
    addNode() {
      console.log(this.get_selected_nodeid());
      this.get_selected_nodeid()
      var selectedNode = this.jm.get_selected_node()
      console.log('selectedNode----',selectedNode);
      if (!selectedNode) { alert('请先选择一个节点'); return }
      var nodeid = this.jsMind.util.uuid.newid()//生成一个新的节点 ID
      var topic = '请输入子节点名称'//topic节点上显示的内容
      this.jm.add_node(selectedNode, nodeid, topic)
      const newMind = { ...this.mind };
      newMind.data.children.push({
        id: nodeid,
        topic: topic
      });
      this.mind = newMind;
    },

这段代码的作用是在用户选择一个节点后,向该节点添加一个新的子节点,并同时更新 Vue 实例中的数据模型,以便反映在界面上。 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1888303.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Jenkins 创建流水线任务

Jenkins是一个流行的持续集成(Continuous Integration,CI)工具。 Jenkins 创建任务 选择“流水线”类型,该类型的优点是定制化程度非常高 (可选)添加“参数化构建” 配置仓库选项(ssh连接、分支)和凭据…

Element-UI - el-table中自定义图片悬浮弹框 - 位置优化

该篇为前一篇“Element-UI - 解决el-table中图片悬浮被遮挡问题”的优化升级部分,解决当图片位于页面底部时,显示不全问题优化。 Vue.directive钩子函数已在上一篇中详细介绍,不清楚的朋友可以翻看上一篇, “Element-UI - 解决el-…

【Python】字典练习

python期考练习 目录 1. 首都名​编辑 2. 摩斯电码 3. 登录 4. 学生的姓名和年龄​编辑 5. 电商 6. 学生基本信息 7. 字母数 1. 首都名 初始字典 (可复制) : d{"China":"Beijing","America":"Washington","Norway":…

企业如何管理安全生产工作?(附模板)

总结一下在企业内管理安全中遇到的一些问题: 1、 管理方式落后,还在使用纸质记录 2、 人员信息杂乱无章,无人整理 3、出现问题找不到源头和负责人 我做系统管理已经7年了,题主说的这些问题我之前也遇到过,相信也有…

Java学习高级一

修饰符 static 类变量的应用场景 成员方法的分类 成员变量的执行原理 成员方法的执行原理 Java之 main 方法 类方法的常见应用场景 代码块 设计模式 单例设计模式 饿汉式单例设计模式 懒汉式单例设计模式 继承 权限修饰符

【MindSpore学习打卡】应用实践-计算机视觉-FCN图像语义分割-基于MindSpore实现FCN-8s进行图像语义分割的教程

图像语义分割是计算机视觉领域中的一个重要任务,它旨在对图像中的每个像素进行分类,从而实现对图像内容的详细理解。在众多图像语义分割算法中,全卷积网络(Fully Convolutional Networks, FCN)因其端到端的训练方式和高…

Git使用中遇到的问题(随时更新)

问题1.先创建本地库,后拉取远程仓库时上传失败的问题怎么解决? 操作主要步骤: step1 设置远程仓库地址: $ git remote add origin gitgitee.com:yourAccount/reponamexxx.git step2 推送到远程仓库: $ git push -u origin "master&qu…

API接口测试/Swgger-ui未授权访问

目录 API接口 接口文档 接口测试的方法 单流程 多流程 Swgger-ui未授权访问 在之间的一次面试中面试官问到了API接口测试,我回答的不好,因为自己确实不太会,后面才下去学习了,这里复习和练习一下 API接口 API(…

DevOps:开发与运维的无缝融合

目录 前言1. DevOps的起源与概念1.1 DevOps的起源1.2 DevOps的定义 2. DevOps的核心实践2.1 持续集成2.2 持续交付2.3 自动化 3. DevOps工具链3.1 版本控制系统3.2 持续集成工具3.3 配置管理工具3.4 容器化与编排工具3.5 监控和日志工具 4. DevOps的实际应用4.1 案例分析&#…

【技巧分享】对接多平台:高效接入淘宝、抖音、京东、拼多多等电商平台API的实战策略

当电商商家想要自研电商管理系统,或是线下ERP厂商想要开发电商业务管理功能,需要对接电商平台API,但电商平台众多,各类平台API接口也需要花费大量的时间和精力去对接,如何快速接入多个电商平台API呢?点三来…

FormMaking表单设计器V3.8发布,数据表格上线,支持多选、多级表头、列模板自定义、操作列、分页等设置

介绍 FormMaking 是基于Vue的可视化表单设计器,赋能企业实现可视化低代码开发模式;帮助开发者从传统枯燥的表单代码中解放出来,更多关注业务,快速提高效率,节省研发成本。 目前已经在OA系统、考试系统、报表系统、流程…

docker push 推送镜像到阿里云仓库

1.登陆阿里云 镜像服务,跟着指引操作就行 创建个人实例,创建命名空间、镜像仓库,绑定代码源头 2.将镜像推送到Registry $ docker login --username*** registry.cn-beijing.aliyuncs.com $ docker tag [ImageId] registry.cn-beijing.aliy…

AI商品图生成定制技术公司

AI绘画模型训练、定制服务公司案例分析— 触站AI,塑造智能设计新纪元 第一:触站AI的创新之路 触站AI的崛起标志着AI技术在艺术与设计领域应用的一个新高度。作为一家专注于企业AI图像领域的技术解决方案服务公司,触站AI以其前沿的技术和定制…

数字化精益生产系统--SRM供应商关系管理

SRM供应商关系管理,全称为Supplier Relationship Management(供应商关系管理)系统,是一种专门用于管理采购供应链和供应商关系的软件系统。该系统通过集成各个环节的采购活动,帮助企业实现采购流程的自动化、标准化和优…

AI智能体|AI打工我躺平!使用扣子Coze智能体自动生成和发布文章到微信公众号(一)

大家好,我是无界生长,国内最大AI付费社群“AI破局俱乐部”初创合伙人。这是我的第 44 篇原创文章——《AI智能体|AI打工我躺平!使用扣子Coze智能体自动生成和发布文章到微信公众号(一)》 AI智能体&#xf…

课程设计——基于FPGA的双向移位寄存器

基于FPGA的双向移位寄存器 摘 要 本文使用verilog HDL语言设计双向移位寄存器,使电路受外部信号控制,实现数字信号的双向移位等功能,其电路设计模块主要分为三个部分,分别为接受判断控制信号的组合逻辑电路部分、实现存储、运算…

系统安全保证措施方案(word原件)

一、身份鉴别 二、访问控制 三、通信完整性、保密性 四、抗抵赖 五、数据完整性 六、数据保密性 七、应用安全支撑系统设计 软件资料获取及全资料学习获取:本文末个人名片或进主页。

2024年江西省研究生数学建模竞赛C题聚变反应堆设计论文和代码分析

经过不懈的努力,2024年江西省研究生数学建模竞赛C题聚变反应堆设计论文和代码已完成,代码为C题全部问题的代码,论文包括摘要、问题重述、问题分析、模型假设、符号说明、模型的建立和求解(问题1模型的建立和求解、问题2模型的建立…

金融科技在反洗钱领域的创新应用

随着金融市场的不断发展和全球化趋势的加速,洗钱活动日益猖獗,给金融机构和社会经济安全带来了严重威胁。为了有效应对这一挑战,金融科技在反洗钱领域的应用逐渐崭露头角,为打击洗钱活动提供了强有力的技术支持。本文将从多个角度…

UG NX二次开发(C#)-根据草图创建拉伸特征(UFun+NXOpen)

文章目录 1、前言2、在UG NX中创建草图,然后创建拉伸特征3、基于UFun函数的实现4、基于NXOpen的实现代码1、前言 UG NX是基于特征的三维建模软件,其中拉伸特征是一个很重要的特征,有读者问如何根据草图创建拉伸特征,我在这篇博客中讲述一下草图创建拉伸特征的UG NX二次开发…