40 lines
955 B
Vue
40 lines
955 B
Vue
|
<template>
|
||
|
<div class="container">
|
||
|
<h1>Quotes</h1>
|
||
|
<app-new-quote @newQuote="newQuote"></app-new-quote>
|
||
|
<hr>
|
||
|
<app-quote-grid :quotes="quotes"></app-quote-grid>
|
||
|
<div class="row">
|
||
|
<div class="col-sm-12 text-center">
|
||
|
<div class="alert alert-info">click a quote to delete it.</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import QuoteGrid from './components/QuoteGrid.vue'
|
||
|
import NewQuote from './components/NewQuote.vue'
|
||
|
export default {
|
||
|
data(){
|
||
|
return {
|
||
|
maxQuotes: 10,
|
||
|
quotes: ["Just a quote to see something"],
|
||
|
|
||
|
};
|
||
|
},
|
||
|
components: {
|
||
|
appQuoteGrid: QuoteGrid,
|
||
|
appNewQuote: NewQuote,
|
||
|
},
|
||
|
methods: {
|
||
|
newQuote(quote) {
|
||
|
this.quotes.push(quote)
|
||
|
},
|
||
|
},
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style>
|
||
|
</style>
|