https://github.com/ktsn/vue-typed-mixins

Type safe Vue.js mixins
https://github.com/ktsn/vue-typed-mixins

mixins typesafety typescript vue

Last synced: 6 months ago
JSON representation

Type safe Vue.js mixins

• Host: GitHub
• URL: https://github.com/ktsn/vue-typed-mixins
• Owner: ktsn
• License: mit
• Created: 2018-02-27T10:53:06.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2019-11-11T08:45:09.000Z (almost 6 years ago)
• Last Synced: 2025-02-13T11:52:37.537Z (8 months ago)
• Topics: mixins, typesafety, typescript, vue
• Language: JavaScript
• Size: 185 KB
• Stars: 105
• Watchers: 5
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Vue Typed Mixins

Type safe Vue.js mixins.

## Example

This has the same capability of canonical Vue [`mixins`](https://vuejs.org/v2/api/#mixins), but is type safe in TypeScript.

```ts

import Vue from 'vue'

import mixins from 'vue-typed-mixins'

const Foo = Vue.extend({

  data() {

    return {

      foo: 'test'

    }

  }

})

const Bar = Vue.extend({

  data() {

    return {

      bar: 123

    }

  }

})

const App = mixins(Foo, Bar).extend({

  data() {

    return {

      value: true

    }

  },

  computed: {

    concat(): string {

      return `${this.foo} ${this.bar} ${this.value}`

    }

  }

})

const vm = new App()

assert(vm.foo === 'test')

assert(vm.bar === 123)

assert(vm.value === true)

assert(vm.concat === 'test 123 true')

```

## License

MIT