vue监听watch使用

watch监听一定要监听:属性值,也就是data

案例

  data () {
    return {
      language: ''
    }
  },
  methods: {
    handleSetLanguage (lang) {
      this.$i18n.locale = lang;
      this.language = lang;
      localStorage.setItem("lang", lang);
    }
  },
  watch: {
    language: {
      handler (val) {
        console.log(val, '改变了');
        if (val) {
          this.menuList = [{
            title: this.$t('navTop.aboutAllianceChain'),
            active: true,
          },
          {
            title: this.$t('navTop.metaUniverseMerchantAlliance'),
            active: false,
          },
          {
            title: this.$t('navTop.nftTradingPlatform'),
            active: false,
          },
          {
            title: this.$t('navTop.projectCommunity'),
            active: false,
          },
          {
            title: this.$t('navTop.newsAnnouncement'),
            active: false,
          },
          {
            title: this.$t('navTop.buyDag'),
            active: false,
          },
          {
            title: this.$t('navTop.purchaseGenesisNode'),
            active: false,
          },]
        }
      },
      immediate: true // 代表进入页面首先执行
    }
  },

感觉文章好的话记得点个心心和关注和收藏,有错的地方麻烦指正一下,如果需要转载,请标明出处,多谢!!!

你可能感兴趣的:(vue,js方法,watch,vue监听)