样式 组件scoped vue

使用vue在移动端显示树状多选功能

最近的项目要求是做一个树状的多选功能,然而该项目是使用vant4作为前端的框架,vant4只有树状单选,没有多选的,那只能自己写一个了。 借鉴博主 https://blog.csdn.net/m0_68428581/article/details/130641982, 我将他的代码转成了vue3的语 ......
功能 vue

react中关于父子组件传值已经方法调用总结

问题: 1、封装自定义组件后,父子组件的传值与方法调用则是必须进行的操作,但是在网上看到多种的方法后, 有的方法一个组件下好使,但是换一个组件后就不好用了 有的方法根本就不好使,不知道是什么原因 2、父子组件之间的传值都是用props这个毫无疑问,也没有什么问题 3、父子组件方法调用则是上面提到的问 ......
父子 组件 方法 react

在vue中使用XLSX库实现Excel的导入导出

XLSX库是个十分强大的利用前端js处理excel文档的库,官网:https://www.sheetjs.com/ vue中安装即使用: 安装 pnpm install xlsx pnpm install xlsx-style-hzx //设置边框与格式用 使用 <div @click="expor ......
Excel XLSX vue

Vue学习笔记(十):全局事件总线

之前博客中介绍了prop和调用事件的方式在父-子组件之间进行数据,这种方式在只有一层嵌套层时可以使用,但是路过存在多层嵌套,多层多个“兄弟”组件之间传递数据,就非常麻烦。对此,vue中提供了一种全局事件总线机制,数据传递是通过一个空的Vue实例作为中央事件总线,通过它来触发事件和监听事件,可以实现几... ......
总线 全局 事件 笔记 Vue

vue el-select/el-cascader获取选中的对象label值

1.el-select获取选中对象label值 <el-form-item label="车辆配置" prop="sales_name"> <el-select v-if="!showSaleNameInput" v-model="form.sales_name" clearable ref="it ......
el-cascader el-select cascader 对象 select

2. Vue简介

三大问题(是什么,为什么,怎么办):Vue是帮助前端优化开发的一个工具,是一个框架 渐进式框架的概念 Vue2 --> Vue3 ......
简介 Vue

Vue监听路由的变化

方式一:watch监听 通过watch监听,当路由发生变化的时候执行 watch:{ $route(to,from){ console.log(to.path); } }, // 或者 watch: { $route: { handler: function(val, oldVal){ consol ......
路由 Vue

「UI开发」DevExpress WPF Pivot Grid组件可轻松实现多维数据分析!(一)

DevExpress WPF Pivot Grid组件是一个类似excel的数据透视表,用于多维数据分析和跨选项卡报表生成。众多的布局自定义选项让您完全控制其UI,以用户为中心的功能使其更易于部署。 P.S:DevExpress WPF拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能 ......
数据分析 DevExpress 组件 数据 Pivot

vue中v-bind绑定元素属性

vue中v-bind绑定元素属性 <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>vue.js</title> </he ......
属性 元素 v-bind bind vue

vue中的v-text指令和v-html指令区别

<html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>vue.js</title> </head> <body> <div i ......
指令 v-text v-html text html

【vue2】实现css动效逐个顺序展示的效果(简陋版)

效果(进入预约里程碑模块后,小人从第一个台阶逐个闪烁出现在当前预约等级之前的台阶并消失,最终停留在当前预约等级的台阶上): 虽然很low但是!就是这么设计的!于是在原本静态的代码上稍加了些修改(为什么,为什么,想问天问大地) 首先是台阶部分的代码: <div :class="$style.reser ......
顺序 效果 vue2 vue css

vue中下载excel文件4种方法,2、通过 a 标签 download 属性结合 blob 构造函数下载发送post请求和后台poi返回文件流实现下载

vue中下载excel文件4种方法,2、通过 a 标签 download 属性结合 blob 构造函数下载发送post请求和后台poi返回文件流实现下载 1、通过url下载 即后端提供文件的地址,直接使用浏览器去下载 通过window.location.href = 文件路径下载 window.lo ......
文件 函数 后台 download 属性

Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法~

前几天在vue运行项目过程中报错了,这个方法是 关于Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法 (1)报错一 (2)报错二~ 1.1问题分析 首先,检查代码,并没有什么错误的地方;其次,涉及到这个问题,可能就 ......
getOptions TypeError function 方法 Syntax

Vue3实战(05)-教你快速搭建Vue3工程化项目

除了Vue 3这个库,还需Vue 3 最新全家桶。 1 环境准备 之前语法演示直接使用script引入Vue 3,从而在浏览器里实现所有调试功能。但实际项目中,使用专门调试工具。在项目上线之前,代码也需打包压缩,并考虑到研发效率和代码可维护性,所以在下面,需建立一个工程化项目实现这些功能。 工具 V ......
Vue3 实战 Vue 项目 工程

vue 中window.onresize有时不生效问题

在vue中多个组件中都使用window.onresize=()=>{},会导致前边赋值的方法被覆盖掉 改成 window.removeEventListener('resize', ()=>{}) 可生效 methods: { myFunction() { ... } }, mounted(){ / ......
onresize window 问题 vue

Spring Cloud 中的分布式组件五花八门,我到底该怎么学?

分布式架构的演进 在软件行业,一个应用服务随着功能越来越复杂,用户量越来越大,尤其是互联网行业流量爆发式的增长,导致我们需要不断的重构应用的结构来支撑庞大的用户量,最终从一个简单的系统主键演变成了一个非常复杂的可以支撑高并发的高可用的分布式架构,但是一个系统再复杂也是不断演变来的,所以从另一方面来说 ......

vue3.2+ts报错:找不到模块“./App.vue”或其相应的类型声明。

解决方法:在项目根目录创建 env.d.ts 文件(如果已有,则在文件中追加)加入下面内容: declare module '*.vue' { import type { DefineComponent } from 'vue'; const vueComponent: DefineComponen ......
vue 模块 类型 vue3 App

【HarmonyOS】低代码平台组件拖拽使用技巧之堆叠容器

​【关键字】 HarmonyOS、低代码平台、组件拖拽、堆叠组件 1、写在前面 从本篇开始,我们一起来学习一下低代码平台中组件的托拉拽,虽然组件拖拽十分简单,但实际上还是有一定的技巧,新手上路难免会遇到一定的问题,如果能熟练掌握拖拽的技巧,能够有效地提升咱们的开发效率哦,今天我们先来学习堆叠组件。 ......
使用技巧 容器 组件 HarmonyOS 代码

【HarmonyOS】低代码平台组件拖拽使用技巧之滚动容器

​【关键字】 HarmonyOS、低代码平台、组件拖拽、滚动容器 1、写在前面 上一篇中我们介绍了低代码平台组件库中的堆叠容器的一些拖拽技巧,本篇我们继续,今天带大家一些来看一个新的组件——滚动容器。关于滚动容器的直接使用其实很简单,所以这个不是今天的重点,今天的重点是如何在原有布局的基础上在外层套 ......
使用技巧 容器 组件 HarmonyOS 代码

vue2常见选项和生命周期钩子函数

Vue2提供了一些其他选项和钩子函数,以支持更高级的组件功能和配置,这些包括: data:data选项用于定义组件的响应式数据。这些数据将被Vue追踪,以便在数据发生变化时更新视图。 data() { return { message: 'Hello, Vue!' } } methods:metho ......
钩子 函数 周期 常见 生命

vue2 父传子,子传父

在Vue 2中,使用props来从父组件向子组件传递数据,而要从子组件向父组件传递数据,通常需要使用自定义事件。关键字分别是: 从父组件向子组件传递数据(父传子): props:可以在子组件中使用props来接收父组件传递的数据。在父组件中,使用子组件标签的属性来传递数据。 示例: <!-- 父组件 ......
vue2 vue

vue cli2 3 4使用lib-flexible px2rem完美解决移动端适配问题

安装 lib-flexible $npm install lib-flexible --save lib-fiexble, lib-flexible会自动在html的head中添加一个meta name="viewport"的标签,同时会自动设置html的font-size为屏幕宽度除以10,也就是 ......
lib-flexible flexible px2rem 问题 cli2

vue动态引入组件

vue动态引入组件,正常情况是页面渲染时动态加载该页面组件,还能进行细化动态加载情况,比如弹窗组件 动态导入:除了路由懒加载,你还可以在其他地方使用动态导入来按需加载组件。例如,在某个按钮的点击事件中异步加载一个组件: import('./components/MyComponent.vue').t ......
组件 动态 vue

Vue生命周期

Vue生命周期 什么是Vue生命周期 指的是Vue从创建到销毁整个过程 在官网中这样说到"每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤"以及"在此过程中,它也会运行被称为生命周期钩子的函数,让开发者有机会在特定阶段运行自己的代码。" 官网图示如下 Vue生命周期函数 初始化显示 bef ......
周期 生命 Vue

Vue学习笔记(九):组件化编程

1 什么是组件¶ 当页面功能十分复杂时,将页面各功能化整为零,拆分成多个不同的小部分,这样便于分析,也有利于代码的复用,在vue中,我们将划分后的每个小部分称为组件。组件化是vue里面最强的功能,可以扩展html,封装重用的代码。在使用vue时,我们可以将一个完整的页面拆分为多个组件,每个组件都用于 ......
组件 笔记 Vue

第十九篇 - Vue如何通过session记住User

登录成功后前端存储user对象 window.sessionStorage.setItem("currentuser", JSON.stringify(successResponse.data.data.user)) 前端script中使用user对象中的值 JSON.parse(sessionSt ......
session User Vue

2.前端框架(Vue)

前端框架(Vue) Vue 概念; vue是一套前端框架,免除原生JavaScript中的DOM操作,简化书写; 基于MVVM(Model-View-ViewModel)思想,实现数据的双向绑定,将编程的关注点放在数据上; 官网:https://v2.vuejs.org/ 框架:是一个半成品软件,是 ......
前端 框架 Vue

讲述vue中data值都有哪些,如何调用

讲述vue中data值都有哪些,如何调用 1,字符串 2,对象 3,函数 4,数字 <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> < ......
data vue

vue项目打包,解决静态资源无法加载和路由加载无效(404)问题

打包后的项目静态资源无法使用,导致页面空白 静态资源无法使用,那就说明项目打包后,图片和其他静态资源文件相对路径不对,此时找到config里面的index.js,在build模块下加入assetsPublicPath: './', 如下图所示, 在History模式下配合使用nginx运行打包后的项 ......
路由 静态 项目 问题 资源

Vue响应式

目录Vue中的响应式对象独立的响应式值计算变量监听响应式变量setup方法 Vue中的响应式对象 Vue3允许在setup()中定义组件需要的数据和方法, 通过return在模板中可以直接使用 reactive方法 <body> <div id = "Application"> </div> <sc ......
Vue