在Vue3.2的setup语法糖中定义组件的name属性

最新推荐文章于 2024-04-09 15:32:05 发布

Y一场做了很久的梦i

最新推荐文章于 2024-04-09 15:32:05 发布

阅读量1.6k

点赞数

分类专栏：踩坑 vue学习文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/qq_45651984/article/details/127090521

版权

踩坑同时被 2 个专栏收录

6 篇文章 1 订阅

订阅专栏

vue学习

3 篇文章 0 订阅

订阅专栏

方法一：

使用多个script标签

<template>
    <div>
        <h1>用户管理</h1>
    </div>
</template>

<script>
    export default {
        name: 'User'
    }
</script>
<script setup>

</script>

<style lang="scss" scoped>

</style>

方法二：

使用 vite 插件 vite-plugin-vue-setup-extend

1.安装

yarn add vite-plugin-vue-setup-extend -D

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

2.在vite.config.js中进行配置

import { defineConfig } from 'vite'
import VueSetupExtend from 'vite-plugin-vue-setup-extend'
export default defineConfig({
    plugins:[vue(), VueSetupExtend()]
})

3.使用

<template>
    <div>
        <h1>用户管理</h1>
    </div>
</template>
<script setup name="User">
// 注意：script标签内容不能为空
</script>

<style lang="scss" scoped>

</style>