el-aside中添加el-menu设置collapse宽度自适应

    根据vue3官方提供的命令行创建项目后，引入element-plus后，尝试通过Container布局容器创建一个简单布局后，在引入后设置collapse为true，进行了折叠，但是并没有折叠，源代码如下：

<script setup lang="ts">
import { ref } from 'vue'
import { Bell, Open, TurnOff, Menu as IconMenu } from '@element-plus/icons-vue'
//el-menu是否水平折叠
const isCollapse = ref(false)
 
//点击el-icon
const turnCollapse = () => {
  isCollapse.value = !isCollapse.value
}
script>
 
<template>
  <div class="common-layout">
    
    <el-container class="app-el-container">
      
      <el-aside>
        
        <el-menu
          default-active="1"
          :collapse="isCollapse"
        >
          <el-menu-item index="1">
            <el-icon>
              <Bell />
            el-icon>
            <span>菜单1span>
          el-menu-item>
          <el-menu-item index="2">
            <el-icon>
              <icon-menu />
            el-icon>
            <span>菜单2span>
          el-menu-item>
        el-menu>
      el-aside>
 
      
      <el-container>
        <el-header>
          
          <el-icon
            :size="50"
            @click="turnCollapse"
          >
            &