mirror of
https://github.com/getbible/app.git
synced 2024-12-22 15:58:55 +00:00
create Verses' vue component to list all the verses in a chapter received as a prop
This commit is contained in:
parent
d3fc061596
commit
df1d167900
34
src/components/Verses.vue
Normal file
34
src/components/Verses.vue
Normal file
@ -0,0 +1,34 @@
|
||||
<template>
|
||||
<ul :dir="dir"
|
||||
class="uk-margin-medium-top uk-list uk-list-divider uk-animation-hover">
|
||||
<li v-for="(verse, i) in chapter" :key="i"
|
||||
:class="`uk-animation-slide-bottom uk-animation-15 uk-animation-hover`">
|
||||
|
||||
<h4 class="btn btn-primary">
|
||||
{{book_name}}
|
||||
<span class="uk-badge badge-light">
|
||||
{{verse.chapter}}:{{verse.verse}}
|
||||
</span>
|
||||
</h4>
|
||||
{{verse.text}} <br/>
|
||||
<p></p>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
dir: {
|
||||
type:String,
|
||||
required:true},
|
||||
book_name: {
|
||||
type:String,
|
||||
required: true,
|
||||
},
|
||||
chapter:{
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user