树形 后台element vue

项目开发之vue中如何刷新子组件,重置组件,重新加载子组件

项目场景:在父组件循环数据列表中,列表中有事件点击打开某个子组件; 父组件中要更新子组件的值 问题描述在父组件循环数据列表中,点击打开某个子组件,A数据打开子组件后,B数据再打开子组件,此时子组件中会有缓存A数据。 原因分析:子组件没有刷新,还是停留在上一个数据缓存 解决方案:给组件添加key值 原 ......
组件 项目开发 项目 vue

C# 递归获取树形结构数据类型

Model:可嵌套子类 public class Equipment { public string Name { get; set; } public Guid Id { get; set; } public Guid ParentId { get; set; } public List<Equi ......
树形 类型 结构 数据

提升数据可视化:拖拽编辑自动汇总,树形数据表格展示新方式

本文由葡萄城技术团队发布。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 前言 树形结构是一种非常常见的数据结构,它由一组以层次关系排列的节点组成。树的结构类似于自然界中的一棵树,树根对应顶层节点,而子节点则分支延伸出来。 在树形结构中,每个节点可以有零个 ......
数据 树形 表格 方式

JavaWebDay2Vue

el表明所接管的区域 #app为id值 data用来接管数据的模型 v-model绑定了一个数据模型 vue常用指令 1:v-bind与v-model v-bind:可以简化为 : 注意:通过v-bind和v-model所绑定的变量必须再数据模型中声明 2.v-on v-on:可以简化为@ 所绑定的 ......

vue3自定义组件全局注入

/** * 自定义组件全局注入 * @param app vue实例 */ import { defineAsyncComponent } from "vue"; export default function (app) { // 收集@/components所有.vue组件 const comp ......
全局 组件 vue3 vue

基于.NET Core + Quartz.NET+ Vue + IView开箱即用的定时任务UI

前言 定时任务调度应该是平时业务开发中比较常见的需求,比如说微信文章定时发布、定时更新某一个业务状态、定时删除一些冗余数据等等。今天给大家推荐一个基于.NET Core + Quartz.NET + Vue + IView开箱即用的定时任务UI(不依赖数据库,只需在界面做简单配置):Quartz.N ......
NET 任务 Quartz IView Core

WPF 解决PasswordBox 属性Password无法绑定到后台的问题

在 WPF 中,你可以使用密码框的 Password 属性来绑定到后台,但是由于安全性考虑,WPF 的密码框不直接支持双向绑定。然而,你仍然可以通过其他方式实现将密码框的内容绑定到后台。 一种常见的方法是创建一个附加属性(Attached Property)来实现密码框的双向绑定。以下是一个简单的示 ......
PasswordBox 后台 Password 属性 问题

vue部署项目报错导致空白页解决

在nginx上部署项目出现空白页并报错 解决方法: 在vue的vue.config.js文件中 改成:module.exports = {publicPath: './'} ......
空白 项目 vue

vue文件下载调取浏览器下载进程

fetch+streamSaver 前端在使用axios发送网络请求时,如文件下载,无法实时获取当前已经下载的文件流,只有当后端返回全部流时,才能在浏览器右下角显示已经完成的进度。 但是当文件很大时,就会出现长时间的等待,而且不显示下载进度。 此时可以通过fetch来发送网络请求实时获取已经下载的文 ......
文件下载 进程 浏览器 文件 vue

在Vue中使用HappyPack

在Vue中使用HappyPack 1、介绍HappyPack 由于有大量文件需要解析和处理,构建是文件读写和计算密集型的操作,特别是当文件数量变多后,Webpack 构建慢的问题会显得严重。 运行在 Node.js 之上的 Webpack 是单线程模型的,也就是说 Webpack 需要处理的任务需要 ......
HappyPack Vue

vue实现打印功能

1. 安装插件 npm install vue-print-nb --save 2. main.js中全局引入 import Print from 'vue-print-nb' Vue.use(Print); 3. 页面中使用 <el-dialog :visible.sync="openCodeCa ......
功能 vue

three.js 3d模型使用|vue项目使用three.js

three.js 3D模型使用 安装 安装three.js npm install three 安装轨道控件插件 npm install three-orbit-controls 安装加载.obj和.mtl文件的插件 npm install --save three-obj-mtl-loader 安 ......
three 模型 项目 js vue

element-ui表单校验|标红提示

elementUI表单校验 1.表单上加rules {object}(常用) 增加普通校验规则 <el-form :model="form" :rules="rules" ref="form"> <el-form-item label="姓名:" :label-width="formLabelWid ......
表单 element-ui element ui

vue3 对子组件使用 v-model,关于绑定对象的问题

这里有最基本的使用,vue3官网 组件 v-model 我来讲讲注意事项, 如果你 v-model 的是个 reactive 创建的对象,那么将不起作用,必须得是 ref 创建的对象 要知道,v-model: <input v-model="searchText" /> <!-- 等价于 --> < ......
对子 组件 对象 v-model 问题

websocket使用方法|vue实时推送

WebSocket实时推送 创建一个WebSocket对象: 准备变量 mounted() { // 初始化 const uri = window.location.href; // 获取网页url const protocol = uri.split("/")[0]; // https: 确定当前 ......
使用方法 实时 websocket 方法 vue

vue 逻辑分页

<template> <div> <div class="paging"> <!--数据显示区域--> <div class="data"> <!--表格存放数组中的数据,并对数据进行截取,以控制每一页显示的数据量--> <!--slice(start,end) 不包括end--> <el-tabl ......
逻辑 vue

vue项目目录讲解

1、build:构建脚本目录 1)build.js ==> 生产环境构建脚本; 2)check-versions.js ==> 检查npm,node.js版本; 3)utils.js ==> 构建相关工具方法; 4)vue-loader.conf.js ==> 配置了css加载器以及编译css之后自 ......
目录 项目 vue

vue 深拷贝

方法一: cloneDeep import { cloneDeep } from 'lodash-es' // 直接使用 const items = cloneDeep(multipleSelection) 方法二: ​通过JSON.parse(JSON.stringify(obj)) 优缺点 满足 ......
拷贝 vue

vue yarn install超时设置

一 删除代理 yarn config delete proxy 二 设置淘宝镜像 yarn config set registry https://registry.npm.taobao.org/ 三 设置超时时间 yarn install --network-timeout 1000000 ......
install yarn vue

Vue入门(1)安装vue环境,创建Vue2 Vue3的项目并且安装IIS环境和发布到IIS

Vue环境的搭建 一. 背景 vue的运行方式有两种 一种是在页面引用vue的js包, 一种是搭建脚手架来vue框架. 我们在这里使用的是第二种方式. 需要安装的软件 npm 16.13.1 LTS 现在最新版已经20了, 建议下载LTSC版 下载地址: https://nodejs.org/en/ ......
环境 Vue IIS 项目 Vue2

js 传参到 vue + 计算属性使用

场景 js 中存储 xAxisData = [......]、yAxisData = [......],想在 vue 中使用,但要求使用前转化成 data 存有若干个 (x, y) 的形式 在改变 xAxisData 或 yAxisData 的任意一值时,都会反馈更新到 vue 的每一个调用了 da ......
属性 vue js

vue3

创建vue项目步骤 npm create vite@latest cd EasyB npm install npm run dev 绑定数据 script模块 <script > import {ref} from 'vue'; export default{ name:'App', setup() ......
vue3 vue

vitest&@vue/test-utils组件单元测试

依赖 "vitest": "0.34.6", "@vue/test-utils": "2.4.3", "axios-mock-adapter": "^1.22.0", 示例 import { mount } from "@vue/test-utils"; import { test, vi } fr ......
test-utils 组件 单元 vitest utils

Vite + Vue配置路径别名@代替 ./src

1.在 vite.config.js 引用 import {resolve} from 'path' 2.添加标黄的 export default defineConfig({ resolve:{ alias:{ "@":resolve(__dirname,"./src") } } }) 3.有图看 ......
别名 路径 Vite Vue src

SpringBoot+Vue实现大文件分块上传

1. 项目背景由于用户需求,需要上传大量图片,只能通过上传压缩包的形式上传,可是压缩包过大时,又会出现上传超时的情况,故需要将压缩包分块上传,然后解压缩图片、若图片过大则再对图片进行压缩。 2. 分块上传分块上传我在用的时候发现有两种:第一种:分块合并接口全由后端接口生成;第二种:前端分块,后端上传 ......
SpringBoot 文件 Vue

介绍 Vue3 的常见目录结构

当着手使用 Vue3 开发项目时,理解其目录结构至关重要。Vue3 的文件组织和模块分隔方式直接关系到项目的可维护性和扩展性。本文将深入探讨 Vue3 的标准目录结构,并提供一些实用的指南和推荐做法。 在 Vue 3 项目中,通常会有以下一些常见的目录和文件: src 目录: src 目录是 Vue ......
常见 结构 目录 Vue3 Vue

介绍 Vue3 的常见目录结构

当着手使用 Vue3 开发项目时,理解其目录结构至关重要。Vue3 的文件组织和模块分隔方式直接关系到项目的可维护性和扩展性。本文将深入探讨 Vue3 的标准目录结构,并提供一些实用的指南和推荐做法。 在 Vue 3 项目中,通常会有以下一些常见的目录和文件: src 目录: src 目录是 Vue ......
常见 结构 目录 Vue3 Vue

SpringBoot+Vue.js实现大文件分片上传、断点续传与极速秒传

亲测好用,这里就直接上代码了,代码有详细的解释。 0. 建表语句SET NAMES utf8mb4;SET FOREIGN_KEY_CHECKS = 0; -- Table structure for file_info-- DROP TABLE IF EXISTS `file_info`;CREA ......
断点 SpringBoot 文件 Vue js

vue2环境变量配置开发环境和生产环境

在项目根目录下新建.env文件 写入变量比如本地链接 VUE_APP_BASE_API=http://127.0.0.1:5000/ 在读取的时候使用process.env.VUE_APP_BASE_API就可以读到这个全局变量 process.env.NODE_ENV有两个值开发环境:develo ......
环境 变量 vue2 vue

Vue报错:error Mixed spaces and tabs no-mixed-spaces-and-tabs

Vue报错:error Mixed spaces and tabs no-mixed-spaces-and-tabs 一、解释 在开发过程中使用了ESLint,用来规范代码风格。ESLint是语法检查工具,缺点是对所写代码要求过于严格。这里是因为空格的使用导致的。 二、报错可能出现的地方 我第一次出 ......