封装elementUI的侧边导航栏并在其他页面通过图标可以控制isCollapse的值使其展开或隐藏，且图标跟随展示或隐藏发生改变

好的，我理解了你的问题。首先，你可以使用 Vue.js 和 ElementUI 来实现侧边导航栏的封装。在侧边导航栏中，你可以定义一个 `isCollapse` 变量来控制导航栏的展开和隐藏状态。你可以在导航栏中添加一个图标，当图标被点击时，可以通过修改 `isCollapse` 变量的值来控制导航栏的展开和隐藏。

下面是一个示例代码，供你参考：

<template>
  <div>
    <el-button type="primary" icon="el-icon-menu" @click="toggleSidebar"></el-button>
    <el-aside :width="sidebarWidth" v-show="!isCollapse">
      <!-- 侧边导航栏的内容 -->
    </el-aside>
    <el-main>
      <!-- 主要内容区域 -->
    </el-main>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isCollapse: true, // 初始状态为隐藏
      sidebarWidth: '200px' // 侧边导航栏的宽度
    }
  },
  methods: {
    toggleSidebar() {
      this.isCollapse = !this.isCollapse;
      this.sidebarWidth = this.isCollapse ? '0' : '200px';
    }
  }
}
</script>

在上面的代码中，我们使用了 ElementUI 中的 `el-button` 和 `el-aside` 组件。当点击按钮时，会触发 `toggleSidebar` 方法来切换侧边导航栏的展开和隐藏状态，并更新 `sidebarWidth` 变量的值，从而实现侧边导航栏的展开和隐藏，并且图标也会跟随展示或隐藏发生改变。

希望这个示例代码可以帮助到你，如果你还有其他的问题，可以继续向我提问。