Skip to content
Permalink
Browse files

Book component is working

fix bug with reflect-metadata
  • Loading branch information
finalcut committed Feb 25, 2020
1 parent a652935 commit 898bfaf770ecfa32a7a369a7c39da0370bb8dc51
Showing with 23 additions and 10 deletions.
  1. +14 −2 src/App.vue
  2. +0 −1 src/app.container.ts
  3. +8 −7 src/components/book/Book.vue
  4. +1 −0 src/main.ts
@@ -37,7 +37,9 @@
<v-container
class="fill-height"
fluid
/>
>
<book :model="book" />
</v-container>
</v-content>
<v-btn
bottom
@@ -60,6 +62,7 @@ import { inject } from 'inversify-props'
import { Registry } from './Registry'
import IBookService from './services/IBookService'
import Book from './components/book/Book.vue'
import IBook from './models/IBook'
// almost everything we create will be a component
// vue apps are components made up of other components
@@ -72,13 +75,22 @@ import Book from './components/book/Book.vue'
export default class extends Vue {
// this is a property getter. Typescript lets us say what type of
// value will be returned (string). It's used up in the template as {{ AppTitle }}
get AppTitle (): string { return 'lootly' }
get AppTitle (): string { return process.env.VUE_APP_TITLE }
@inject(Registry.IBookService)
private bookService!: IBookService
// some bogus properties to act as placeholders for the layout we're starting with
private drawer: boolean = false
private dialog: boolean = false
private book: IBook | null = null
async created (): Promise<void> {
await this.bookService.get('1').then((result) => {
this.book = result
console.log(this.book)
})
}
}
</script>
@@ -1,4 +1,3 @@
import 'reflect-metadata'
import { container } from 'inversify-props'
import { Registry } from './Registry'

@@ -1,23 +1,24 @@
<template>
<div v-if="model">
<h1>{{ model.title }}</h1>
<div>
<h1 v-if="model">
{{ model.title }}
</h1>
</div>
</template>

<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator'
import { inject } from 'inversify-props'
import { Registry } from '@/Registry'
import IBook from '@/models/IBook'
import IBookService from '@/services/IBookService'
@Component({
name: 'book'
})
export default class extends Vue {
@Prop(Object) readonly model!: IBook
@inject(Registry.IBookService)
private bookService!: IBookService
mounted () {
console.log('book component')
console.log(this.model)
}
};
</script>
@@ -1,3 +1,4 @@
import 'reflect-metadata'
import { Vue } from 'vue-property-decorator'
import App from '@/App.vue'
import vuetify from '@/plugins/vuetify'

0 comments on commit 898bfaf

Please sign in to comment.
You can’t perform that action at this time.