Skip to content
Permalink
Browse files

if,for,show,bind,on kullanımı

  • Loading branch information...
erselgulyaz committed Mar 20, 2018
1 parent bdef553 commit fe921bdd76cd18c45ae7b86408db4f8c15a1f26f
Showing with 90 additions and 2 deletions.
  1. +68 −2 src/App.vue
  2. +22 −0 src/components/BasicComponent.vue
@@ -1,14 +1,80 @@
<template>
<div id="app">
{{message}}
<div class="if-kullanimi" v-if="ifControl">Bu alan ifControl isimli seçicinin true/false değerine göre görüntülenebilir.</div>
<hr>
<div class="for-kullanimi" v-for="item in forArray" :key="item">
{{item.id}} - {{item.name}} {{item.surname}}
</div>
<hr>
<div class="show-kullanimi" v-show="showControl">Bu alan showControl isimli seçicinin true/false değerine göre görüntülenebilir.</div>
<hr>
<basic-component v-bind:list=bindArray />
<hr>
<div class="on-kullanimi">
<button v-on:click="helloFunc('deneme mesajı')">Click Me!</button>
</div>
</div>
</template>

<script>
import BasicComponent from './components/BasicComponent.vue'
export default {
data () {
return {
message: 'Hello World!'
ifControl: true,
forArray: [
{
id: 1,
name: 'Ahmet',
surname: 'CAN'
},
{
id: 2,
name: 'Veli',
surname: 'KARA'
},
{
id: 3,
name: 'Fatma',
surname: 'NUR'
},
{
id: 4,
name: 'Mamadou',
surname: 'Niang'
}
],
showControl: false,
bindArray: [
{
id: 1,
name: 'Ahmet',
surname: 'CAN'
},
{
id: 2,
name: 'Veli',
surname: 'KARA'
},
{
id: 3,
name: 'Fatma',
surname: 'NUR'
},
{
id: 4,
name: 'Mamadou',
surname: 'Niang'
}
]
}
},
components: {
BasicComponent
},
methods: {
helloFunc: function (parameter) {
alert(parameter)
}
}
}
@@ -0,0 +1,22 @@
<template>
<div>
<div :key="item" v-for="item in list">
{{item.id}} - {{item.name}} {{item.surname}}
</div>
</div>
</template>

<script>
export default {
data () {
return {
}
},
props: {
list: { type: Array, required: true }
}
}
</script>

<style scoped>
</style>

0 comments on commit fe921bd

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