记录vue3.0的坑--watch新旧数据相同

Posted 2021-09-03 llfididi

1.先上代码

<script>
import { reactive ,toRefs, ref ,watch} from "vue";
import { useRouter } from "vue-router";

export default {
  setup() {
    const state = reactive({
      password: null,
      username: null,
    });
    // const router = useRouter();

    // const goto_home = (() => {
    //   router.replace( \'/userList\')
    // })
    const affirm = ()=>{
      console.log(\'enter\')
    }

    watch(()=>state.username, (newValue, oldValue) => { //直接监听
    console.log("改变了",newValue,oldValue,state);
});
    return {
      affirm,
      ...toRefs(state)
    };
  },
};
</script>

这是正确的监听方式

2.如果是监听全部时

    watch(state, (newValue, oldValue) => { //直接监听
    console.log("count改变了",newValue,oldValue,state);

});

newValue和 oldValue是一样的（都是修改后的值）

推荐方式1，这样可以监听到修改前和修改后的值