{"id":21615832,"url":"https://github.com/valango/vue-tidy","last_synced_at":"2026-04-16T08:32:10.606Z","repository":{"id":87587284,"uuid":"302386066","full_name":"valango/vue-tidy","owner":"valango","description":null,"archived":false,"fork":false,"pushed_at":"2020-10-08T16:07:45.000Z","size":337,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-10T08:41:13.372Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/valango.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-10-08T15:34:26.000Z","updated_at":"2020-10-08T16:07:09.000Z","dependencies_parsed_at":"2023-03-13T18:43:46.705Z","dependency_job_id":null,"html_url":"https://github.com/valango/vue-tidy","commit_stats":{"total_commits":4,"total_committers":1,"mean_commits":4.0,"dds":0.0,"last_synced_commit":"337ca356b93c52325e6865adfbb546e5dc13d7c0"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/valango/vue-tidy","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valango%2Fvue-tidy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valango%2Fvue-tidy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valango%2Fvue-tidy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valango%2Fvue-tidy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/valango","download_url":"https://codeload.github.com/valango/vue-tidy/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valango%2Fvue-tidy/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260475666,"owners_count":23014904,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-24T22:12:57.196Z","updated_at":"2026-04-16T08:32:10.577Z","avatar_url":"https://github.com/valango.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-tidy\n[![Build Status](https://travis-ci.org/valango/vue-tidy.svg?branch=master)](https://travis-ci.org/valango/vue-tidy)\n[![Code coverage](https://img.shields.io/codecov/c/gh/valango/vue-tidy?label=codecov\u0026logo=codecov)](https://codecov.io/gh/valango/vue-tidy)\n\nA tiny Vue.js mix-in for event handler management and memory leaks prevention.\nIt also provides a simple API for easier debugging and diagnostics.\n\nProcessing DOM events or similar in OO code implies correct set-up and releasing of event handlers.\nAlso, cross-referenced class instances and other objects need special care to prevent\nthe dreaded memory leaks.\n\n## Installation\n`  npm install -S vue-tidy`\u003cbr /\u003eor\u003cbr /\u003e`  yarn add vue-tidy`\n\n## Usage\n```vue\n\u003ctemplate\u003e\n  \u003cdiv :id=\"unique\"\u003e\u003c/div\u003e\n\u003c/template\u003e\n\u003cscript\u003e\nimport tidyOwner from 'vue-tidy'\n\nexport default {\n  data: () =\u003e ({ \n    unique: undefined   //  Can be used as element ID if we have many instances.\n  }),\n\n  name: 'Funny',\n\n  mixins: [tidyOwner],\n\n  created() {\n    this.debugOn(true)  //  In DEV environment, this enables following .debug() calls.\n    this.unique = this.ownTag\n    //  Everything we do next, will be auto-undone before we vanish.\n    this.own.fiend1 = reference_to_some_other_thing\n    this.ownOn('resize', 'onResize', window)\n    this.debugOn(true)  //  If we need this...\n  },\n\n  methods: {\n    onResize() { \n      this.debug('onResize')      //  --\u003e 'Funny#1 onResize +0ms' on developer console.\n      /* do something smarter */ \n    }\n  }\n}\n\u003c/script\u003e\n```\n\n## API\nThe mix-in is the default export. \n\nThe mix-in adds the following features to a vue instance:\n\n### Lifecycle hooks\n   * _`created`_ - sets up the machinery;\n   * _`beforeDestroy`_ - calls _dispose()_ method (see below).\n\n### Instance methods\n   * **`debug`**`(...)`\u003cbr /\u003eoutputs coloured and timestamped console messages, when enabled;.\n   * **`debugOn`**`([*]): *`\u003cbr /\u003eenables or disables `debug` method and returns _`this`_\n   for chaining, if argument supplied; otherwise returns _boolean_ showing if debugging is enabled.\n   * **`dispose`**`()`\u003cbr /\u003efrees up all bound resources, called automatically by _`beforeDestroy`_ hook.\n   It cleans the _**`own`**_ container, firing _`dispose`_ method of every\n   object instance having it. Then it _un-registers all handlers_ set by _`ownOn`_ method.\n   * **`ownOff`**`(event= : string, emitter= : Object) : this`\u003cbr /\u003e\n   un-registers handlers registered for matching (event, emitter) pairs.\n   It is called by dispose(), so in most cases you don't need to call it explicitly.\n   * **`ownOn`**`(event : string, handler, emitter, api=) : this`\u003cbr /\u003e\n   registers _`event`_ _`handler`_ with _`emitter`_ object.\n   If emitter API differs from `addEventListener/removeEventListener` or `$on/$off` or `on/off`,\n   then you need explicitly define the API, like `['listenTo', 'ignore']`.\n   The _`handler`_ parameter can be instance method name or a function.\n   \n### Instance properties\n   * **`own`**`: Object`\u003cbr /\u003ea keyed container for private data, that should be gracefully cleaned up.\n   * **`ownClass`**`: string`\u003cbr /\u003eclass name (read-only).\n   * **`ownId`**`: number`\u003cbr /\u003eglobally unique class instance number(read-only).\n   * **`ownTag`**`: string`\u003cbr /\u003eis set to _`ownClass`_`+ '#' +`_`ownId`_ (read-only).\n   \nAssigning a value to any instance property will throw `TypeError`.\n\n### Overriding dispose() method\nTo do something special during beforeDestroy hook, you may define _**`ownDispose()`**_ method.\nIf defined, this method will run first and if it returns _boolean `false`_,\nthe default _`dispose()`_ will not be called.\n\n### Name guess helper\nThere is a helper function used internally for initializing the _`ownClass`_ property.\n\n`guess(vm, [tryHarder : boolean]) : {string | undefined}`\n\nThis function can work without the mix-in as well. It must be imported separately:\u003cbr /\u003e\n`  import guess from 'vue-tidy/guess'`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalango%2Fvue-tidy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvalango%2Fvue-tidy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalango%2Fvue-tidy/lists"}