鼠标移入移出设置某块区域显示隐藏

@mouseenter="leftNavShow = true" @mouseleave="leftNavShow = false"

代码记录：

<div @mouseenter="leftNavShow = true" @mouseleave="leftNavShow = false">

          <div>

            <img src="@/assets/images/framework.png" alt />

          </div>

          <span>

            组织架构

            <div class="arrow">

              <img

                src="@/assets/images/downArrow.png"

                alt

                :class="leftNavShow ? 'active' : ''"

              />

            </div>

            <div class="leftNav" v-show="leftNavShow">

              <el-tree

                :data="departmentDate"

                @node-click="recursionId"

                :default-expand-all="true"

                :expand-on-click-node="false"

              ></el-tree>

            </div>

          </span>

        </div>

 

data() {

    return {

      leftNavShow: false,

    };

  },