树形 后台element vue

【Vue3.0】关于 script setup 语法糖的用法

script setup - 简介 先来看一看官网关于 <script setup> 的介绍: 要彻底的了解 setup 语法糖,你必须先明确 setup() 这个 组合式API 官网中对于这一api的介绍是—— 在 setup() 函数中返回的对象会暴露给模板和组件实例。其它的选项也可以通过组件实 ......
语法 script setup Vue3 Vue

MySql树形结构(多级菜单)查询设计方案

背景 又很久没更新了,很幸运地新冠引发了严重的上呼吸道感染,大家羊过后注意休息和防护 工作中(尤其是传统项目中)经常遇到这种需要,就是树形结构的查询(多级查询),常见的场景有:组织架构(用户部门)查询 和 多级菜单查询 比如,菜单分为三级,一级菜单、二级菜单、三级菜单,要求用户按树形结构把各级菜单查 ......
树形 菜单 结构 方案 MySql

Vue+echart 展示后端获取的数据

最近在合作做一个前后端分离项目时,为了测试我写的后端部分获取数据的效果,自己也学了一下 vue 的知识,在获取 json 信息这里也踩了很多坑。 这里列举下我返回的 json 部分信息: { "house_basic": [ { "HOUSE_ID": "00001", "HOUSE_NAME": ......
数据 echart Vue

如何在现有的Vue项目中嵌入 Blazor项目?

目前官方只提供了angular和react俩种示例,所以本教程将来讲解如何在Vue的现有项目中使用,上期已经做好了react的教材! 准备流程 Vue 项目创建流程 使用Vue创建一个Demo项目 全部选择默认No即可 然后项目名称就用demo了 npm init vue@latest cd dem ......
项目 Blazor Vue

Vue3 企业级优雅实战 - 组件库框架 - 9 实现组件库 cli - 上

上文搭建了组件库 cli 的基础架子,实现了创建组件时的用户交互,但遗留了 cli/src/command/create-component.ts 中的 createNewComponent 函数,该函数要实现的功能就是上文开篇提到的 —— 创建一个组件的完整步骤。本文咱们就依次实现那些步骤。(友情 ......
组件 实战 框架 企业 Vue3

react 高效高质量搭建后台系统 系列 —— 请求数据

其他章节请看: react 高效高质量搭建后台系统 系列 请求数据 后续要做登录模块(主页),需要先和后端约定JSON数据格式,将 axios 进行封装,实现本地的数据模拟 mockjs。 Tip:spug 中后端返回 json 通常有 data 和 error两个 key。就像这样:{data: ......
高质量 后台 数据 系统 react

react 高效高质量搭建后台系统 系列 —— 脚手架搭建

其他章节请看: react 高效高质量搭建后台系统 系列 脚手架搭建 本篇主要创建新项目 myspug,以及准备好环境(例如:安装 spug 中用到的包、本地开发和部署、自定义配置 react-app-rewired、代理 http-proxy-middleware、babel),为后续搭建真正的框 ......
脚手架 高质量 后台 系统 react

react 高效高质量搭建后台系统 系列 —— antd和样式

其他章节请看: react 高效高质量搭建后台系统 系列 antd 后续要做登录模块(主页),不仅要解决请求数据的问题,还需要完成 antd 配置以及样式的准备。 antd 多种主题风格 详情请看 这里 spug 没有提供多种主题风格。 笔者还是决定稍作研究,万一公司需要呢。 步骤如下: 安装 le ......
高质量 样式 后台 系统 react

如何做好一款管理后台框架

序 2020 年 10 月 17 日,我正式发布了 Fantastic-admin 这款基于 Vue 的中后台管理系统框架。在这两年多的时间里,我陆续写了几篇我在开发这套框架中的一些心得和技术总结: 2020 年《我是如何设计后台框架里那些锦上添花的动画效果》 2020 年《一劳永逸,解决基于 ke ......
后台 框架

vue3+TS 自定义指令:长按触发绑定的函数

#vue3+TS 自定义指令:长按触发绑定的函数 偶然间看到一个在vue2中写的长按触发事件的自定义指定,想着能不能把他copy到我的vue3项目中呢。 ##编写自定义指令时遇到的几个难点 ###1.自定义指令的类型 在ts中写任何东西都要考虑到类型的问题,自定义指令的类型问题依然存在 ###2.在 ......
指令 函数 vue3 vue TS

Vue中关于数组与对象修改触发页面更新的机制与原理简析

Vue中关于数组与对象修改触发页面更新的机制与原理简析 相关问题 数组 使用索引直接赋值与直接修改数组length时,不会触发页面更新。 例如: <script> export default { name: "HomeView", data: () => ({ list1: ["A", "B"], ......
数组 原理 对象 机制 页面

Vue3 企业级优雅实战 - 组件库框架 - 8 搭建组件库 cli

前面的文章分享了组件库的开发、example、组件库文档,本文分享组件库 cli 开发。 1 为什么要开发组件库 cli 回顾一个新组件的完整开发步骤: 1 在 packages 目录下创建组件目录 xxx: 1.1 使用 pnpm 初始化 package.json,修改 name 属性; 1.2 ......
组件 实战 框架 企业 Vue3

VUE项目无法启动NODE版本与NODE-SASS、SASS-LOADER版本不兼容解决方案

一、错误分析 在VUE项目开发中,我们经常会遇到报错: Node Sass version 7.0.1 is incompatible with ^4.0.0。 网上解决方案也千奇百怪,最终操作下来,也是搞了个寂寞,项目依旧无法正常运行,通常这种情况普遍都是团队或者项目使用的NODE版本不一致。 二 ......
版本 NODE SASS SASS-LOADER NODE-SASS

Agileboot 1.6.0 发布啦 - 一款致力于规范/精简/可维护 的Springboot + Vue3的快速开发脚手架

⚡平台简介⚡ AgileBoot是一套开源的全栈精简快速开发平台,毫无保留给个人及企业免费使用。本项目的目标是做一款精简可靠,代码风格优良,项目规范的小型开发脚手架。 适合个人开发者的小型项目或者公司内部项目使用。也可作为供初学者学习使用的模板项目。 前端采用Vue3、Element UI。对应前端 ......

ArcObjects SDK 014 MapSurround和普通Element

1、如何获取MapSurround 和获取MapFrame类似,如果你已经获取指北针、比例尺等对象,可以通过IGraphicsContainer的FindFrame函数获取。如果没有,则通过IGraphicsContainer循环所有Element去判断即可。 2、添加MapSurround 指北针 ......
MapSurround ArcObjects Element 014 SDK

Vue3.0 生命周期

所有生命周期钩子的this上下文都是绑定至实例的。 beforeCreate:在实例初始化之后、进行数据帧听和事件/侦听器的配置之前同步调用。 created:实例创建完成,主要包括数据帧听、计算属性、方法、事件/侦听器,(注意:由于挂在阶段还未开始,因此$el还不可用)。 beforeMount: ......
周期 生命 Vue3 Vue

vue3项目,记录我是如何用1h实现产品预估1天工作量的界面需求

最近在编写前端界面,硬是一人一周时间加班加点写完了一个项目的前端界面(一级菜单有12个页面+一个控制台大屏,二三级界面有N个),之前预估前端界面的编写需要一个月,我是自己把自己卷死了(没有办法,项目经理说项目要1周写界面,2周发版,我这个项目前端只我1个人,后端有3个人...).......我只想说 ......
界面 需求 项目 产品 vue3

通过surging的后台托管服务编写任务调度并支持规则引擎自定义脚本

简介 过去,如果在业务中需要处理任务调度的时候,大家都会使用第三方的任务调度组件,而第三方组件有一套自己的规则,在微服务的中显得那么格格不入,这样就会造成代码臃肿,耦合性高,如果有分布式还需要搭建新的分布式环境,如果把任务调度做成组件服务,这个就完全满足了微服务的模块化,组件化,而下面谈的是在sur ......
脚本 后台 规则 任务 surging

React报错之Element type is invalid

总览 产生"Element type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got"错误有多个原因: 在导入组件时,将默 ......
Element invalid React type is

React报错之React.Children.only expected to receive single React element child

总览 当我们把多个子元素传递给一个只期望有一个React子元素的组件时,会产生"React.Children.only expected to receive single React element child"错误。为了解决该错误,将所有元素包装在一个React片段或一个封闭div中。 这里有个 ......
React Children expected element receive

Vue快速上门(2)-模板语法

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架,同他周边的生态共同构成了一个灵活的、渐进式的前端框架。 本文内容包括模板的基本语法,及各种指令的使用,最后总结了Vue动画的使用。 ......
语法 模板 Vue

Vue快速上门(3)-组件与复用

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架,同他周边的生态共同构成了一个灵活的、渐进式的前端框架。 本文内容是关于组件式开发,为了复用提供的各种机制,如混入、指令、过滤器,及Vue插件开发。 ......
组件 Vue

Vue快速上门(1)-基础知识图文版

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架,同他周边的生态共同构成了一个灵活的、渐进式的前端框架。 本文内容首先了解了MVVM的基本原理,然后是Vue的基本结构和选项参数、实例Api、全局API等。 ......
基础知识 图文 基础 知识 Vue

vue-router路由之路-极简教程

什么是前端路由?前端路由的一个大背景就是当下流行的单页应用SPA,一些主流的前端框架,如vue、react、angular都属于SPA,那什么是SPA呢?如何使用前端路由vue-router呢? ......
路由 vue-router 教程 router vue

JavaScript冒泡排序+Vue可视化冒泡动画

冒泡排序(Bubble Sort)算是前端最简单的算法,也是最经典的排序算法了。网上JavaScript版本的冒泡排序很多,今天用Vue实现一个动态的可视化冒泡排序。 ......
JavaScript 动画 Vue

Vue 响应式原理模拟以及最小版本的 Vue的模拟

在模拟最小的vue之前,先复习一下,发布订阅模式和观察者模式 对两种模式有了了解之后,对Vue2.0和Vue3.0的数据响应式核心原理 1.Vue2.0和Vue3.0的数据响应式核心原理 (1). Vue2.0是采用Object.defineProperty的方式,对数据进行get,set方法设置的 ......
Vue 原理 版本

微信小程序实战,基于vue2实现瀑布流

瀑布流,又称瀑布流式布局。是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部。 ......
瀑布 实战 程序 vue2 vue

Tauri+Rust+Vue 跨平台桌面应用简明教程(1)环境创建+系统事件+自定义菜单

作者:小牛呼噜噜 | https://xiaoniuhululu.com 计算机内功、JAVA底层、面试相关资料等更多精彩文章在公众号「小牛呼噜噜 」 Tauri简介 Tauri 是一个工具包,可以帮助开发者为主要桌面平台制作应用程序(如 mac,windows,linux 等)。几乎支持现有的任何 ......
简明教程 菜单 桌面 事件 环境

Vue2组件间通讯

Vue2组件通信的基础方式 自己的理解:组件化通信,无非就是数据你传我,我传你,两个组件的相互交流,方法很多,下方有图示(此篇建议小白阅读,大神的话也不会看,哈哈哈哈!仅供参考,有不同的意见可以一起交流!) 父传子(父组件传给子组件数据) 子传父(子组件传给父组件数据) 任意组件间通讯 父组件给子组 ......
组件 通讯 Vue2 Vue

vue 中使用 this 更新数据的一次大坑

情景说明: 之前用 vue 做数据绑定更新时,发现一个莫名奇妙的问题。 我在 vue 实例中声明了一个数组属性如 books: [],在异步请求的回调函数中使用 this.books = res.data.data; 进行数据更新,更新步骤后面紧跟着打印了 console.log(this.book ......
大坑 数据 this vue