Sky_Tsumugi
2022-03-17 14:13
采纳率: 72.7%
浏览 79
已结题

vue3.2 数据视图未同步更新

监听路由来判断是否在登录页面,在登陆页面,不展示导航组件,其他页面展示导航组件
<template>
  <div class="nav-btn">
    <NavBar v-show="isShowNav"></NavBar>
    <h2>{{isShowNav}}</h2>
    <router-view></router-view>
  </div>
</template>



<script setup>
import NavBar from './components/NavBar.vue'
import { useRouter, useRoute } from "vue-router"
import { ref, reactive, watch } from 'vue'
const route = useRoute()
let isShowNav = ref(false)
watch(route, (newValue,oldValue)=>{
  console.log(newValue.name);
  if(newValue.name == 'login'){
    isShowNav = false
  }else{
    isShowNav = true
  }
},{
  deep: true
})

</script>
运行结果及报错内容

img

img

我想要达到的结果

我在监听路由后对isShowNav 进行赋值,但视图中的isShowNav是没有变化的,请问为什么会这样,该怎么修改

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

4条回答 默认 最新

相关推荐 更多相似问题