vue3+ts项目记录第4页

vue3+ts封装chooseCity城市选择器

文章目录vue3+ts封装chooseCity概述重点代码项目完整代码vue3+ts封装chooseCity概述先上效果图样式采用elementplus，各个组件详情查看elementplus官网整体采用

会飞的战斗鸡·2023-11-21 05:07

基于vue3+ts配置化form表单组件实现浅析

这里基于Vue2及之前无为低代码平台的一些经验，封装了一份Vue3+Ts版本的配置化表单基础组件。

junner443·2023-11-21 05:03

uniapp和vue3+ts创建自定义下拉选择框组件

使用uniapp开发小程序的时候，使用了uview的ui组件，但是里面没有下拉选择组件，只有Picker选择器，但是我们想要使用下拉选择的组件，所以需要自定义个一个下拉选择的自定义组件，我就只能自己动手创建这个自定义组件了，支持：多选，单选，下拉框在框内还是框外实现的效果：自定义组件源代码：Select.vue-->{{item.text}}{{changevalue.length?changev

1024小神·2023-11-21 05:57

vue3+ts 实现防抖功能

使用自定义ref实现带防抖功能的v-modelimport{customRef}from'vue'exportfunctionuseDebouncedRef(value:T,delay=200){lettimeout:any=nullreturncustomRef((track,trigger)=>{return{get(){track()returnvalue},set(newValue:T){

真前端·2023-11-20 20:57

vue vite webpack全局scss样式文件

全局的scss样式文件，先安装sass-resources-loader插件，再创建vue.config.js文件(即使你用vue3+ts，也要用js后缀，感觉ts只作用于src里面)，再配置一下就行插件下载方法

前端菜鸟丶Ndie·2023-11-20 16:37

vue3+ts扩展全局属性

在使用vue3+ts配置全局变量，需要添加一下扩展文档https://cn.vuejs.org/guide/reusability/plugins.html

weixin_44689966·2023-11-20 07:35

【Vue3+TS】Composition API(一)

Vue3+TS之CompositionAPI(一)文章目录Vue3+TS之CompositionAPI(一)写在前面1）setup2）ref函数3）reactive函数4）reactive对比ref5）

程序媛小y·2023-11-20 06:32

vue3+TS实现简易组件库

vue3+TS搭建一个自己的组件库。前置首先下载vue-cli，搭建我们的环境，vue-create-luckyUi，选择vue3和TypeScript。在src目录下创建package作为组件目录。

前端开发小陈·2023-11-20 06:32

vue3+ts 动态组件的使用

import{reactive,ref,markRaw,shallowRef}from"vue";importAVuefrom"./components/A.vue";importBVuefrom"./components/B.vue";importCVuefrom"./components/C.vue";constcomId=shallowRef(AVue);constactive=ref(0)

你的美，让我痴迷·2023-11-20 06:02

vue3+ts withDefaults的使用

title:{{title}}list:{{list}}import{ref}from"vue";withDefaults(defineProps(),{list:()=>[4,87,3],});

你的美，让我痴迷·2023-11-20 06:01

vue3+ts，slot插槽，表格组件封装

新建三个文件src\components\page-content\page-content.vue表格公共文件src\view\main\system\department\config\content.config.ts表格数据配置src\view\main\system\department\department.vue父组件，传输数据department.vue{{scope.row[sc

qq_26596795·2023-11-20 06:58

vue3+ts学习记录

vue3+ts学习记录说明watch默认props值的设置拿到子组件暴露的某些属性值异步组件与分包传送门Teleportkeep-alive的两个生命周期官方有些自带的东西自定义全局函数变量CSS选择器动态

flying_chick·2023-11-20 06:56

vue3+ts插槽的使用

232{{data.name}}----{{data.age}}sddssd{{index}}sdsdsggfhhg-->232{{data.name}}----{{data.age}}sddssd{{index}}sdsdsggfhhgwodfgghfhimportDialogfrom"./components/dialog.vue";import{ref}from"vue";letname=r

你的美，让我痴迷·2023-11-20 06:54

VUE3+TS实现鼠标悬浮显示一段文字提示

VUE3+TS实现鼠标悬浮显示一段文字提示vue3+TS鼠标悬浮显示文字，实现效果如下图所示：HTML代码如下,主要代码为:title，它的作用为鼠标悬浮显示文字typescript代码如下所示conststate

RobertTeacher·2023-11-19 14:39

vue3+ts 自定义hook函数

首先在src下建立一个文件夹,命名:userhookhandle在文件夹下面建立usermousehandles.tsimport{onBeforeUnmount,onMounted,ref}from'vue'exportdefaultfunction(){constx=ref(1)consty=ref(1)constclickhandler=(event:MouseEvent)=>{x.valu

小鱼程序员·2023-11-19 07:28

某个订单项目记录，涉及MQ消息处理、分布式问题、幂等性等问题解决设计

文章目录消息队列（MessageQueue）什么场景下，使用消息队列？消息队列概述RabbitMQ消息队列RabbitMQ概念名词概念RabbitMQ流程RabbitMQ安装RabbitMQ页面介绍Exchange交换机类型SpringBoot整合RabbitMQAmqpAdmin与RabbitTemplate的使用整合的序列化问题SpringBoot整合的RabbitListener监听@Rab

喵不拉几·2023-11-17 05:10

vue3-使用vite构建vue3+ts项目

一、使用vite构建项目1.运行创建项目命令#使用npmnpmcreatevite@latest#使用yarnyarncreatevite#使用pnpmpnpmcreatevite2.填写项目名字与选择项目框架、语言限制类型1.填写项目名称2.选择框架vue3.选择TypeScript4.创建成功二、安装路由1.vscode打开项目，安装router，less，less-loader，@types

星星点点..·2023-11-16 13:13

vue3+ts issue —— vue.ts 不是模块。

那是因为AppLayout.vue中创建了一个空的script标签，而且语法使用的是ts语法。vuecli会用ts语法解析和校验解决方案：如果是无状态组件，删掉就好了如果是有状态组建，导出该组件的实例就好了

一闪一闪亮晶晶，漫天都是小星星·2023-11-16 13:09

【微前端】micro-app搭建项目实战

@micro-zoe/micro-app--save2、初始化micro-appimportmicroAppfrom‘@micro-zoe/micro-app’microApp.start()项目环境vue3

咸蛋超人l·2023-11-16 13:35

Vue3+TS手写音乐播放器

一、路由，配置main.tsApp.vueindex.vue初始化一、结构布局css:iconPark字体图标库npm下载二、循环遍历左侧菜单列表二级菜单：两层遍历简单举例：项目写法：****项目中将ts抽离出来，专门放一个ts文件：三、点击左侧菜单，右侧跳转相对路由：四、点击左侧菜单时的样式：router里设置五、轮播图swiperyarnaddswiper-S六、axios封装.tsyarna

青铜小菜姬·2023-11-15 03:13

uniapp使用及踩坑项目记录

环境准备下载HBuilderX使用命令行创建项目：webstorm环境准备webstorm支持rpx:1.下载wechatminiprogramsupport插件2.在Preferences中搜索WechatMiniProgram，将小程序支持启用3.注意：每次重新导入之后要再次启用一下（这个插件只针对当前导入文件项生效）Hbuilder失去焦点自动保存处理一些常识准备项目导入cnpm镜像手动切换

HerayChen·2023-11-15 01:54

Gradle使用Docker部署 Spring Boot项目记录

一、Docker来部署SpringBoot的应用修改build.gradle文件中添加dockerBuilder方法；buildscript{repositories{mavenCentral()maven{url"https://plugins.gradle.org/m2/"}}dependencies{classpath'gradle.plugin.com.palantir.gradle.do

魏都青年·2023-11-14 02:17

关于Vue3+ts引入文件使用alias别名@时报错问题，process is not defined

如题，解决办法：一、首先确保有两个文件： tsconfig.json vite.config.ts(注：如果是vue.config.js，则手动改为vite.config.js)二、在ts.config.json中修改{"compilerOptions":{......"paths":{"@/*":["src/*"]}}}三、在vite.config.ts中修改exportdefaultdef

浪里小韭菜·2023-11-14 00:15

基于docker部署spring cloud微服务项目，实操版本

前言基于业务需求，需要部署springcloud项目，之前用docker部署jar包，本次需要部署微服务项目记录下全套部署，从零开始。

jyjsjava·2023-11-13 17:51

vue3+ts 组合式api中（setup)如何使用getCurrentInstance，以及用它替代this

vue3的setup中没有this时需要使用getCurrentInstance()来获取。getCurrentInstance()可以用来获取当前组件实例let{proxy}=getCurrentInstance();getCurrentInstance是一个function方法，getCurrentInstance()是一个对象，proxy也是一个对象。proxy是getCurrentInst

是个散人·2023-11-13 10:57

Vue3+Ts element-plus table下拉嵌套echarts展开loading问题

Vue3+Tselement-plustable下拉嵌套echarts展开loading问题给loading绑定后台返回数据的唯一id判断他在数组中的有无来进行loading的展示//通过获取数据的唯一标识id的下标来控制loading的显示7日30日在onMounted中调用queryData()根据后台返回的值来进行id的单独存储(这里存的id是渲染表格的id)state.tmp=data.m

June_OY·2023-11-11 19:59

uniapp和vue3+ts开发小程序，使用vscode提示声明变量冲突解决办法

在uniapp中，我们可能经常会遇到需要在不用的环境中使用不同变量的场景，例如在VUE3中的小程序环境使用下面的方式导入echarts：constecharts=require('../../static/echarts.min');如果不是小程序环境则使用下面的方式导入echarts：//由于vue3使用vite不支持umd格式的包，故引入npm的包import*asechartsfrom'ec

1024小神·2023-11-11 18:36

在Vue3+TS的项目中使用Vuex模块化管理状态

VueX模块化管理-直接上手创建/store/index.ts//创建状态管理import{createStore}from"vuex";//配置模块化管理importloginModulefrom'./login/login'//根节点状态属性interfaceIRootState{name:stringage:number}//必须传入此泛型conststore=createStore({st

开通VIP·2023-11-11 14:32

阿里云部署docker项目流程

阿里云部署docker项目流程这是自己的项目项目原来的项目是一个手机远程管理交换机的项目，项目中包含嵌入开发，python+flash对接的flutter（android+ios）,mysql,redis,vue3

living habit·2023-11-11 07:15

vue pdf文件流预览

PS：项目是Vue3+TS的，vue-pdf没找到ts版本的，所以换了个新的依赖。需要先将文件流处理成pdfurl的格式。

不知言·2023-11-11 05:18

vscode中 vue3+ts 项目的提示失效，volar插件失效问题解决方案

文章目录前情提要bug回顾解决方案最后前情提要说起来很耻辱，从mac环境换到window环境，vscode的配置都是云端更新过来的，应该是一切正常才对，奇怪的是我的项目环境出现问题了，关于组件的ts和追踪都没有效果，再经过一上午的排查和试错后，终于被我解决，问题的原因是volar和ts环境之间的版本不匹配，下面来看下我的解决过程和问题复现。bug回顾大家的插件库里应该都有一个这样的插件这是一个增强

Min;·2023-11-09 09:34

Mac上用Nginx部署前端项目记录

1、项目打包，打开Finder使用command+shift+G，输入：/usr/local/var/www/，进入到www文件下，将的打包好的文件，放进去。这里我打包后的文件是一个dist文件。2、打开终端，在终端输入cd/usr/local/etc/nginx，回车。3、配置nginx.conf文件，输入vimnginx.conf，回车，进入nginx.conf文件。在文件server内，配置

她有点懒·2023-11-08 17:41

项目记录：SSE/NEON快速指令集优化像素拷贝

SSE/NEON`快速指令集优化像素拷贝项目需求:360全景图划分成TILE.高纬度按4:1下采样.中纬度按2:1下采样.低纬度1:1渲染时,高纬度按1:4还原.中纬度按1:2还原.做法:SIMD,singleinstructionmultipledata,单指令流多数据流,一次运算指令可以执行多个数据流.使用指令集进行并行优化.SSE指令集SSE本质上类似于一个向量处理器,包括了4个主要部分单精

桑来93·2023-11-07 03:38

vue3+ts 项目遇到的问题和bug

1.router中使用pinia报错pinia.mjs:1709UncaughtError:[]:"getActivePinia()"wascalledbuttherewasnoactivePinia.Areyoutryingtouseastorebeforecalling"app.use(pinia)"?Seehttps://pinia.vuejs.org/core-concepts/outsi

风无雨·2023-11-06 15:24

2021-06 电商项目客户行为分析及预测

项目记录：本项目原始数据为某电商平台半年业务数据。

mlxgccc·2023-11-06 11:02

vue3+ts获取组件Type-safe ref 实例

在vue3中获取组件的类型：typeEleForm=InstanceType在template中获取组件的refimport{Options,Vue}from'vue-class-component'import{ElForm}from'element-plus'@Options({components:{ElForm,},})exportdefaultclassHomeextendsVue{//

ci0n·2023-11-05 21:16

Vue3+TS 任意vue组件中变更NaiveUI 全局组件语言

上一篇《Vue3+TSi18n插件使用与配置》文章，我们已经有了一个i18n.global.locale.value参数，它可以设置和获取当前语言，那么我们可以在NaiveUI全局配置初始化的时候就赋值，这样就能达到切换页面中自定义文字语言时顺带切换UI组件语言，这也就是为什么执行setLanguage方法的时候会加重新加载页面代码了，如果有更好的实现方法可以在评论区回复，感谢！在App.vue文

煮茶忘放糖·2023-11-05 16:54

Vue3+TS i18n插件使用与配置

首先安装库：npmivue-i18n@[email protected]配置：import{defineConfig}from"vite"importvuefrom"@vitejs/plugin-vue"importpathfrom'path'import{vueI18n}from"@intlify/vite-plugin-vue-i18n

煮茶忘放糖·2023-11-04 00:59

14-Vue的CompositionAPI

前言本文章来源于王红元老师（coderwhy）的Vue3+Ts课程附上链接：https://ke.qq.com/course/3453141谁能拒绝一个*100%好评还加课的老师呢目录前言OptionsAPI

MJJH·2023-11-03 21:27

Supervisor启动服务(java，python，vue3+ts)

admin.jar配置到/etc/rc.d/rc.local文件，需要给rc.local赋权限，才能开机启动：chmod+x/etc/rc.local放rc.local启动容易启动失败，所以我们放Supervisor一、Supervisor的安装方式11、安装Python包管理工具(easy_install)yuminstallpython-setuptools2、安装Supervisoreasy

夏婉妹妹·2023-11-02 03:02

Node 多版本管理（清晰明了）

概述最近学习cloud项目，前端使用到vue3+ts等技术，在启动vue3项目中需要node版本较高（16.15.0），但自己又不想卸载原来的版本，这时使用需要Node多版本管理，根据项目官方文档提供的方法在此记录一下

sout-lanys·2023-11-01 09:51

vue3+ts使用vue-i18n

vue3+ts使用vue-i18n1、安装插件npminstall--savevue-i18nyarnaddvue-i18n2、配置文件locale/index.tsimport{createI18n}

孤月葬花魂·2023-10-31 02:40

安防监控项目记录6——cgi移植与html的通信

boa服务器的存在是为了cgi与html的通信而cgi的存在又是为了A9与html的通信完成后可以在网页端进行一些对A9端的控制以及信息的上传

技术尖刀·2023-10-30 14:38

vue3+ts二次封装element plus的el-table时使用row-class-name无法生效，或奇数行生效、偶数行不生效

先贴一张成品图目录先贴一张成品图一开始想看看怎么封装这个属性（未解决）但是我还是把代码贴到这里，有没有大佬看看这种写法能不能获取值啊解决：后面我决定把属性穿透，直接引用官方的然后问题来了，偶数行不生效，奇数行好的。（改了下样式解决了）重点是这个，我从控制台找出来的需要覆盖的样式一开始想看看怎么封装这个属性（未解决）参考了：（实测用不了！！！）二次封装组件调用row-class-name方法二次封装

喵(* ￣3)(ε￣ *)·2023-10-28 05:21

vue3 + fastapi 实现选择目录所有文件自定义上传到服务器

yma16·2023-10-27 13:07

基于Kubesphere容器云平台物联网云平台Devops实践

基于Kubesphere容器云平台物联网云平台Devops实践项目背景公司是做工业物联网相关业务的，现业务是云平台，技术栈后端为Springboot2.7+JDK11，前端为Vue3+Ts，需要搭建自动化运维平台以实现业务代码自动部署上线

风离·2023-10-27 08:24

安防监控项目记录7——阶段性测试

将以上工作完成后基于分层与信息流向的思想完成信息自下而上与自上而下的控制与获取此处信息包括命令运用项目开始设定的通信结构体将命令打包上报，解包向下控制

技术尖刀·2023-10-26 19:18

【vue3+ts】@设置别名

新建的vue3+ts项目，建路由的时候报错：在vite.config.ts中新增如下代码：import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importpathfrom"path

办公室的忍者·2023-10-25 14:52

看完才发现饼图插入图片so easy!

一、此案例基于Vue3+ts，效果展示：二、单个属性的值:series.radius：['百分比','百分比']第一个值设置内圈的大小，第二个值设备外圈的大小两个值配合可以设置圆圈的粗细series.center

Her...·2023-10-25 12:43

echarts案例之双折线渐变图

一、此案例基于Vue3+ts，效果展示：二、单个属性的值：1、tooltip中的trigger属性值：1.axis是鼠标hover到一条柱状图显示全部数据2.item是鼠标hover到折线点显示相应数据