learnin-some-vue/s10QuoteApp/src/App.vue

40 lines
955 B
Vue
Raw Normal View History

2018-04-19 03:10:01 +00:00
<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>