How to use the v-click-outside.directive function in v-click-outside

return this.article.read ? 'Mark as unread' : 'Mark as read'
    },
    pocketConnected () {
      return this.$store.state.Setting.pocket_connected
    }
  },
  watch: {
    '$route.fullPath': {
      immediate: true, // Immediate option to call watch handler on first mount
      handler () {
        this.resetData()
      }
    }
  },
  directives: {
    clickOutside: vClickOutside.directive
  },
  methods: {
    resetData () {
      this.original = false
      this.settingspanel = false
      this.$store.dispatch('turnOnFontSetting', false)
    },
    openOriginal (url) {
      this.original = !this.original
      this.$emit('openOriginalArticle', this.original, url)
    },
    hideTextConfig () {
      this.settingspanel = !this.settingspanel
      this.$store.dispatch('turnOnFontSetting', this.settingspanel)
    },
    changeFontStyle (fontStyle) {

//     delete el.__vueClickOutside__;
//   }
// };
import vClickOutside from "v-click-outside";
import Cocos from "../models/cocos";
import { mapState, mapMutations, mapActions } from "vuex";
import { setTimeout } from "timers";
export default {
  data() {
    return {
      selectAccount: false,
      list: []
    };
  },
  directives: {
    clickOutside: vClickOutside.directive
  },
  computed: {
    ...mapState(["cocosAccount", "isLocked", "accountType", "cocos"])
  },
  mounted() {
    this.loadAccounts();
  },
  // directives: { clickoutside },
  watch: {
    "cocosAccount.accounts"(val) {
      if (val) {
        this.loadAccounts();
      }
    }
  },

import { ERRORCODE } from '../../lib/errors/code'

const BackBar = () => import('../components/BackBar');

async function nonContractSendTransaction(data) {
  const type = MTypesZilPay.CALL_SIGN_TX;
  const payload = data;
  await new Message({ type, payload }).send();  
}

export default {
  name: 'Send',
  mixins: [GasFee, clipboardMixin, AccountListing],
  components: { BackBar },
  directives: {
    clickOutside: vClickOutside.directive
  },
  data() {
    return {
      isAdvance: false,
      isInput: false,

      amount: 0,
      to: null,
      resolveDomain: null
    };
  },
  computed: {
    ...mapState('Static', [
      'network'
    ]),
    isWarning() {

import fromZil from '../filters/from-zil'


export default {
  name: 'Jumbotron',
  components: { },
  mixins: [
    Jazzicon,
    clipboardMixin,
    AccountListing,
    explorer
  ],
  filters: { toConversion, fromZil },
  directives: {
    tooltip,
    clickOutside: vClickOutside.directive
  },
  data() {
    return {
      isDropdown: false
    };
  },
  computed: {
    ...mapState(['conversionRate']),
    ...mapState('Static', [
      'currency'
    ])
  },
  mounted() {
    this.jazziconMake(this.account.address, 'acc');
  },
  methods: {