在Vue3中如何使用正确使用插槽

        我在最近的学习中使用到了slot插槽，因为之前一直使用Vue2创建的项目，所以在使用具名插槽的时候没有出现问题。但是在Vue3中使用slot遇到了问题，原本具名插槽<slot name=""></slot>不起效果了

        Vue3废弃了原本的slot，官方推荐使用v-slot

 

 需要注意的是，v-slot只能在<template></template>中使用，最重要的是<template></template>需要一个子组件的包裹下才可以使用，具体代码如下

我在子组件NavBar.vue中定义了三个具名插槽，在父组件Home.vue中需要在子组件<nav-bar></nav-bar>的包裹中使用具名插槽<template #center></template>（‘#’是v-slot语法糖写法）

写css代码的时候注意是在<style></style>里面写而不是<style scope></style>,以上就是我在学习过程中遇到的问题并解决的过程