Vue中 $router.push 跳转页面为什么，跳转完毕我的事件里面的操作没有执行呢？

Question

页面就是跳转的时候切换图片 if一个图片 else 一个图片 这是一个组件 需要的导入这个组件

    <footer>
            <ul>
                <li @click="tu_one(1)"><img src="../assets/home_ji.png" v-if="tab == 'tab-1'"/><img src="../assets/home_ji_fan.png" v-else/></li>
                <li @click="tu_one(2)"><img src="../assets/home_shou.png" v-if="tab == 'tab-2'"/><img src="../assets/home_shou_fan.png" v-else/></li>
                <li @click="tu_one(3)"><img src="../assets/home_user_fan.png" v-if="tab == 'tab-3'"/><img src="../assets/home_user.png" v-else/></li>
            </ul>
    </footer>

data(){
            return{
                tab:"tab-2"
            }
        },
            tu_one(num){
                let _num = parseInt(num,10);
                switch (_num){
                    case 1:
                    this.$router.push("/Record");
                        break;
                    case 2:
                    this.$router.push("/home");
                        break;
                    case 3:
                    this.$router.push("/user");
                        break;
                    default:
                        break;
                }
                this.tab = `tab-${_num}`;
                console.log(this.tab);//可以打印出来
            }
        }

页面正常跳转没问题 但是图片一直没动 这是为啥呢？ 怎么解决呢？

Answer 1

页面直接跳转过去了啊，当前页面的内容都应销毁了，你当然看不到页面中的变化了。

Answer 2

好像没有methods啊?

这个footer组件会不会在每个router-view内组件里都引入了?