有条件地在$route路径更改时显示div不起作用

在前端开发中，当$route路径更改时，可以通过监听路由变化来实现显示div的效果。具体实现方式如下：

首先，需要使用一个前端框架或库来管理路由。常见的前端路由管理工具有Vue Router、React Router等。这里以Vue Router为例进行说明。
在Vue项目中，首先需要安装并引入Vue Router。可以通过以下命令安装Vue Router：

npm install vue-router

然后在项目的入口文件（一般是main.js）中引入Vue Router：

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

在Vue项目中，可以通过定义路由配置来管理不同路径对应的组件。在路由配置中，可以指定每个路径对应的组件，以及其他相关配置项。例如：

const routes = [
  {
    path: '/',
    component: Home
  },
  {
    path: '/about',
    component: About
  },
  // 其他路由配置...
]

const router = new VueRouter({
  routes
})

在需要显示div的组件中，可以通过监听路由变化来判断$route路径是否更改。一般可以使用Vue Router提供的导航守卫（Navigation Guards）来实现。导航守卫包括全局守卫、路由守卫和组件守卫等。

在组件中，可以使用beforeRouteUpdate守卫来监听$route路径的变化。例如：

export default {
  // 其他组件配置...
  beforeRouteUpdate(to, from, next) {
    // 判断$route路径是否更改
    if (to.path !== from.path) {
      // 执行显示div的操作
      // 例如，可以通过修改组件中的data属性来控制div的显示与隐藏
      this.showDiv = true;
    }
    next();
  }
}

在上述代码中，beforeRouteUpdate守卫会在$route路径发生变化时被调用。在守卫中，可以根据需要执行显示div的操作。

需要注意的是，上述代码中的showDiv是一个示例变量，表示控制div显示与隐藏的状态。具体的实现方式可以根据项目需求进行调整。

总结起来，通过监听路由变化并使用导航守卫，在$route路径更改时可以实现显示div的效果。具体的实现方式可以根据项目使用的前端框架或库进行调整。