Vue3使用setup-extend简化组件名写法

如果我们在Vue3中要使用setup的语法糖,就需要使用两个script标签,一个用于设置组件的name属性,一个用于编写setup中的代码。如下:

但是我们有觉得光是因为一个name属性就多写一个script标签有点麻烦了。

因此我们可以使用插件来进行简化,将name作为script标签的属性来设置组件名。

使用方法:

1. 安装setup-extend

npm i vite-plugin-vue-setup-extend -D

 

2. 在vite-config.js中调用插件

3. 在script标签上配置name

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

会话技术复习笔记

一.登录校验的需求 什么是登录校验? 所谓登录校验,指的是我们在服务器端接收到浏览器发送过来的请求之后,首先我们要对请求进行校验。先要校验一下用户登录了没有,如果用户已经登录了,就直接执行对应的业务操作就可以…

iOS 面试 Swift基础题

一、Swift 存储属性和计算属性比较: 存储型属性:用于存储一个常量或者变量 计算型属性: 计算性属性不直接存储值,而是用 get / set 来取值 和 赋值,可以操作其他属性的变化. 计算属性可以用于类、结构体和枚举,存储属性只能用于类和结构体。存储属性可…

爬虫学习笔记-get请求获取豆瓣电影排名多页数据★★★★★

1. 导入爬虫需要使用的包 import urllib.request import urllib.parse 2.创建请求函数 def create_request(page): # 定义不变的url部分 base_url https://movie.douban.com/j/chart/top_list?type5&interval_id100%3A90&action& # 根据规律定义data拼接url …

倒排索引的构建与查询

倒排索引是信息检索的重要技术,本文将基于中文短信数据(数据集可在本文所附资源处下载或点击此处链接下载),编程构建倒排索引并实现布尔查询。 1. 功能设计 用户输入查询,按下回车键,如果该查询作为单独的…

宏景eHR FrCodeAddTreeServlet SQL注入漏洞

免责声明:文章来源互联网收集整理,请勿利用文章内的相关技术从事非法测试,由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失,均由使用者本人负责,所产生的一切不良后果与文章作者无关。该…

微信小程序|摇骰子

目录 简介设计与功能需求确定用户界面设计确定摇骰子动画效果确定随机数生成算法编码实现实现摇骰子动画测试与优化进行功能测试进行性能测试说明简介 制作一个摇骰子小程序是一个有趣且具有挑战性的项目。通过这个项目,你可以学习如何运用编程技术来模拟骰子的摇动和结果显示…

Linux的bash命令语法

可用点 #!/bin/bash # 文件要以上面开始,.sh结尾的文件不需要# 赋权文件可执行权限 chmod x <fileName># 获取java jar包启动的进程id ps -ef | grep *.jar | grep -v grep | awk {print $2}shell变量 变量命令规则&#xff1a; 只能包含字母、数字、下划线&#xff1…

麒麟系统—— openKylin 安装 mongodb

麒麟系统—— openKylin 安装 mongodb 一、准备工作1. 确保麒麟系统 openKylin 已经安装完毕。 二、下载解压 MongoDB二、增加环境变量三、配置MongoDB创建数据目录创建日志文件运行 四、加入到服务中 MongoDB是一款高性能、开源的NoSQL数据库&#xff0c;因其灵活的数据结构、…

基于DistFlow潮流的配电网故障重构MATLAB程序

微❤关注“电气仔推送”获得资料&#xff08;专享优惠&#xff09; 简介 程序采用适用于辐射状网络的DistFlow潮流模型&#xff0c;可输入任意故障线路编号&#xff0c;得到优化重构结果。程序加入了辐射状和连续状约束&#xff0c;保证网络连通性和辐射性&#xff0c;改换成…

Linux CPU 负载说明

一、背景 工作中我们经常遇到CPU 负载高&#xff0c;CPU负载高意味着什么&#xff1f; CPU的负载是怎么计算的&#xff1f; top指令中的各个指标代表什么含义&#xff1f; 二、CPU 负载计算方法 在系统出现负载问题&#xff0c;通常会使用uptime和top确认负载&#xff0c;这两…

15、Kafka ------ SpringBoot 整合 Kafka (自动配置类 KafkaAutoConfiguration 源代码剖析)

目录 SpringBoot 整合 Kafka 的自动配置及源代码剖析Spring Boot 为 Kafka 提供的自动配置KafkaAutoConfiguration Kafka自动配置类源码解析1、自动配置类&#xff1a;KafkaAutoConfiguration 注解解析2、自动配置类&#xff1a;KafkaAutoConfiguration 配置的 bean1、KafkaTem…

2024 年, Web 前端开发趋势

希腊哲学家赫拉克利特认为&#xff0c;变化是生命中唯一不变的东西。这句话适用于我们的个人生活、行业和职业领域。 尤其是前端开发领域&#xff0c;新技术、开发趋势、库和框架不断涌现&#xff0c;变化并不陌生。最近发生的一些事件正在改变开发人员构建网站和 Web 应用的方…

mysql中的锁

按照锁的粒度分 表锁 表级锁&#xff0c;增删改操作时&#xff0c;会给正张表加锁&#xff1b; myisam支持表级锁&#xff0c;innodb中默认没有使用表锁&#xff0c; 特点&#xff1a;虽然加锁的开销小&#xff0c;但是并发性能低。 间隙锁 满足某些条件&#xff0c;获取…

Selenium教程11:模拟账号密码,自动登入qq空间

Python爬虫教程30&#xff1a;Selenium网页元素&#xff0c;定位的8种方法&#xff01; Selenium自动化教程02&#xff1a;浏览器options配置及常用的操作方法 Selenium自动化教程03&#xff1a;延时等待的3种方式 Selenium自动化教程04&#xff1a;鼠标键盘网页的模拟操作 …

AJAX进阶(重点)

目录 ◆ 同步代码和异步代码 ◆ 回调函数地狱和 Promise 链式调用 什么是回调函数地狱&#xff1f; Promise - 链式调用 什么是Promise链式调用&#xff1f; Promise 链式应用 &#xff08;重点&#xff09; ◆ async 和 await 使用 async函数和await_捕获错误 ◆ 事…

算法设计与分析实验:滑动窗口与二分查找

目录 一、寻找两个正序数组的中位数 1.1 具体思路 1.2 流程展示 1.3 代码实现 1.4 代码复杂度分析 1.5 运行结果 二、X的平方根 2.1 具体思路 2.2 流程展示 2.3 代码实现 2.4 代码复杂度分析 2.5 运行结果 三、两数之和 II-输入有序数组 3.1 采用二分查找的思想 …

ES6详解

一 let 和 const ES6中可以使用let和const声明变量&#xff0c;用法类似于var const声明的为常量&#xff0c;不可修改&#xff08;但声明对象&#xff0c;对象中的属性可以修改&#xff09;&#xff0c;由于这个特性&#xff0c;它需要在声明的同时就赋值&#xff0c;否则报错…

SpringBoot+SqlServer查询接口

SpringBootSqlServer查询接口 文章目录 SpringBootSqlServer查询接口1. pom环境配置2. common工具包3. 实体类接口映射4. Service层Controller层 需求&#xff1a;根据站号查询前一个小时的所有数据&#xff0c;将数据返回格式为Map<String,List<Map<String,String>…

双非本科准备秋招(9.2)——力扣哈希

1、383. 赎金信 跟昨天的题大同小异&#xff0c;因为只有26个字母&#xff0c;所以可以建个有26个坑位的数组。 做完昨天的题目&#xff0c;这个题没啥新意。 class Solution {public boolean canConstruct(String ransomNote, String magazine) {int[] hashTable new int[…

语言模型大战:GPT、Bard与文心一言,谁才是王者?

如何对GPT-3.5、GPT-4、Bard、文心一言、通义千问的水平进行排序&#xff1f; 在聊技术原理之前我们来先看看几个产品的团队背景 一、团队背景 1.1、ChatGPT ChatGPT团队的成员大多具有计算机科学、人工智能、自然语言处理、机器学习等相关领域的高等教育背景&#xff0c;有…