last day (78 days later) » 

12:03 PM
0
A: Using props in BeforeMount or Mounted- VUE.JS

cafertayyarThe link and this post by LinusBorg say child components are mounted before the parent component is mounted. Therefore, console.log(this.kpi_kalite) in the child component does not print the data gotten from the axios in the parent. So, if you do not render the child component at first, it will n...

 
that's so logical. I tried but it is not still working. Output is "undefined"
 
Could you share the content of response.data if it is possible?
 
Sure, Object 0: 0: {kpi: 1, actual: 100, target: 150, commitment: 300} 1: {kpi: 5, actual: 21, target: 22, commitment: 23} [[Prototype]]: Object 1: 0: {kpi: 2, actual: 23, target: 20, commitment: 25} [[Prototype]]: Object 2: 0: {kpi: 3, actual: 25, target: 12, commitment: 23} [[Prototype]]: Object 3: 0: {kpi: 4, actual: 76, target: 75, commitment: 79} [[Prototype]]: Object 4: [[Prototype]]: Object [[Prototype]]: Object
I'm sorry for this format :/
 
Did console.log(response.data) print this format?
 
output: Object 0: 0: {kpi: 1, actual: 100, target: 150, commitment: 300} 1: {kpi: 5, actual: 21, target: 22, commitment: 23} [[Prototype]]: Object 1: {0: {…}} 2: {0: {…}} 3: {0: {…}} 4: {} [[Prototype]]: Object
i'm missing something.I'm resarching but i couldn't find how i fix it. here is the link: codepen.io/sudesanil/pen/LYLBMBg console.log(this.kpi_kalite[i]) -> ` Proxy {0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}} [[Handler]]: Object [[Target]]: Array(5) 0: {0: {…}, 1: {…}} 1: {0: {…}} 2: {0: {…}} 3: {0: {…}} 4: {} [[Prototype]]: Array(0) `
 
12:03 PM
In the child component, what does console.log(this.kpi_kalite) print in mounted()? Also, could you write props in the child component please?
Or, if it is possible, could you add the whole code of both parent and child components in your link codepen.io/sudesanil/pen/LYLBMBg
 
this is parent component : codepen.io/sudesanil/pen/qBjygXz this is child component: codepen.io/sudesanil/pen/rNwrPGQ
 
Excuse me for the fact that I asked a lot of questions. I have one more question. In the child component, which one prints undefined: console.log(this.kpi_kalite) or console.log(JSON.parse(JSON.stringify(this.kpi_kalite)))?
 
console.log(this.kpi_kalite). Beacuse 'for loop' does not run
 
Probably, I got why undefined is printed. I have read the code of the parent component. There are multiple child components kpi-card-sude in the parent. Only one of them has the prop :kpi="kpi_kalite" and other ones do not have this prop. In the child component KpiCardSude, there is no default value of kpi_kalite in the props.
Therefore, it prints undefined for the child components that do not have :kpi="kpi_kalite". For testing, if you use one child component like <kpi-card-sude v-if="renderChildComponent" :kpi="kpi_kalite" ></kpi-card-sude> in the parent, it will print the value of kpi_kalite in the child.
Türkçe de konuşabiliriz isterseniz.
 
Türkçeyi tercih edeirm teşekkürler
 
12:06 PM
Rica ederim. Child component'da props kısmında kpi_kalite için su tanımlı:
kpi_kalite: {
type: Array,
required: true
},
bunun default değeri yok
 
default: null olarak denesem?
 
eğer parent kısmında <kpi-card-sude :kpi="kpi_kalite" ></kpi-card-sude> şeklinde kpi_kalite'yi vermezsek default değer otomatik undefined oluyor
null denersen çıktı olarak null yazar büyük ihtimal, bir dene istersen
Bir de props kısmında required: true tanımlı, dolayısıyla illaki :kpi="kpi_kalite" kullanmak gerektiği anlaşılıyor, Gerçekten zorunlu alan mı child component'da?
 
evet null dedi
 
Bir de props kısmında required: true tanımlı, dolayısıyla illaki :kpi="kpi_kalite" kullanmak gerektiği anlaşılıyor, Gerçekten zorunlu alan mı child component'da?
 
evet gerçekten zorunlu bir alan, diğer kpi-card-sude taglarinde de göndereceğim verileri
çünkü kpi card sude componeneti grafik çizen bir component. Ve o grafikteki kullanacağım verileri parent component'de axios get yaparak alıyorum
 
12:11 PM
Eğer tüm kpi-card-sude taglarında <kpi-card-sude v-if="renderChildComponent" :kpi="kpi_kalite" ></kpi-card-sude> şeklinde kullanırsanız, değerini yazacaktır diye umuyorum
 
tüm kpi card taglerini, <kpi-card-sude v-if="renderChildComponent" :kpi="kpi_kalite" ></kpi-card-sude> olarak değiştirdim
null şu anda
 
default değer props kısmında null mı şu anda
 
evett
 
şu an önemli bir şey farkettim, props kımsında kip diye bir şey yok :)
<kpi-card-sude v-if="renderChildComponent" :kpi_kalite="kpi_kalite" ></kpi-card-sude> kullanmak lazım
 
default :function () { return [] } şeklinde denediğimde [] olarak yazıyor konsola
 
12:16 PM
<kpi-card-sude v-if="renderChildComponent" :kpi_kalite="kpi_kalite" ></kpi-card-sude> böyle deneyebilir misiniz parent kısmında?
 
aaa evet
 
o zaman ansıl null ve function () { return [] } bu değişiklikleri renderlayabildi
onu hiç anlamadım
 
çünkü default değer onlar, parent kısmında :kpi_kalite="kpi_kalite" şeklinde tanımlamadığımızda, otomatik default değeri kullanıyor vue
 
evet dediğiniz gibi yaptım
rray(0)length: 0[[Prototype]]: Array(0)
Array(0)
Array(0)
Array(0)
Array(0)

Şuan default değerde function () { return [] } var
 
12:20 PM
şu an bir şeyler yazmış, istediğiniz çıktı formatı nasıl bir şey?
 
console.log(response.data) nın çıktısı şu şekilde parent component'de:

0:
0: {kpi: 1, actual: 100, target: 150, commitment: 300}
1: {kpi: 5, actual: 21, target: 22, commitment: 23}
[[Prototype]]: Object
1: {0: {…}}
2: {0: {…}}
3: {0: {…}}
4: {}
Ben her bir {kpi: 5, actual: 21, target: 22, commitment: 23} objesini child componente göndermeyi deniyorum
for(let i in this.kpi_kalite){

console.log(this.kpi_kalite[i])
// console.log(JSON.parse(JSON.stringify((this.kpi_kalite[0])[1])))

}
Bir for döngüsünde props olarak göndereceğim this.kpi_list'e eklemeyi deniyorum.
Ardından child compoenentte mounted da prop olan this.kpi_list çıktısını yazdırmayı denedim ve görmek istediğim aslında yine şunlardan : {kpi: 5, actual: 21, target: 22, commitment: 23}
 
Sadece this.kpi_kalite[0] içeriği olan şunlar gidecek değil mi?
0: {kpi: 1, actual: 100, target: 150, commitment: 300}
1: {kpi: 5, actual: 21, target: 22, commitment: 23}
 
yani elimed [{kpi: 5, actual: 21, target: 22, commitment: 23},{kpi: 5, actual: 21, target: 22, commitment: 23}] bu tarz oluşan bir liste olduğunu hayal ediyorum
aslında this.kpi_kalite[0] = {kpi: 1, actual: 100, target: 150, commitment: 300}
this.kpi_kalite[1] = {kpi: 5, actual: 21, target: 22, commitment: 23}
.
.
.
şeklinde devam edecek
1: {0: {…}}
2: {0: {…}}
3: {0: {…}}
4: {}
şuradaki gibi içi boş olan diğer objeler de buna->{kpi: 5, actual: 21, target: 22, commitment: 23} benzer değerler içerecek ve onlarida kpi_kalite gibi diğer değişkene koyup kpi-card-sude componentine göndereceğim
 
Parent kısmında console.log(this.kpi_kalite[0]) denediğiniz zaman ne yazıyor çıktı olarak?
 
şimdi undefined dedi
 
12:30 PM
response.data'dan gelen veriyi json formatında yazma imkanınız var mı?
 
console.log(JSON.parse(JSON.stringify((response.data))) şeklinde?
{0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}} şekilde bir çıktı veriyor. İçeriği ise:

0: {0: {…}, 1: {…}}
1: {0: {…}}
2: {0: {…}}
3: {0: {…}}
4: {}
[[Prototype]]: Object
-----------------------------------------
0: {0: {…}, 1: {…}} ' nin içeriği ise:
0: {kpi: 1, actual: 100, target: 150, commitment: 300}
1: {kpi: 5, actual: 21, target: 22, commitment: 23}
[[Prototype]]: Object
 
response.data'daki sıfırıncı elemanın sıfırıncı elemanı mı göstermek istediğimiz? Mesela response.data[0][0] ne yazıyor?
 
evet response.data[0][0]'ın içinde {kpi: 1, actual: 100, target: 150, commitment: 300} şunların olması lazım
onları göstermek istiyoruz
 
tamam bunu this.kpi_kalite=response.data[0][0] olarak setlerseniz gösterecektir
Bir dakika, response.data[0][0] sadece {kpi: 1, actual: 100, target: 150, commitment: 300} mi yazdı?
 
ever {kpi: 1, actual: 100, target: 150, commitment: 300} yazıyor
 
12:43 PM
Hmm, o zaman console.log(response.data[0] instanceOf Array) ne yazıyor?
 
o zaman benim iç içe bir for döngüsünde this.kpi_kalite=response.data[i][j] şeklinde eklemem gerekir
console.log(response.data[0]) bu mu ?
console.log(response.data[0]) -> {0: {…}, 1: {…}} ve içinde {kpi: 1, actual: 100, target: 150, commitment: 300} bunlar var
 
console.log(response.data[0] instanceof Array) response.data[0] Array mi onu öğrenmek istedim
response.data[0] da sanırım Object. O zaman, dediğiniz gibi for döngüsü kullanıp listeye ekleyebilirsiniz.
 
console.log(response.data[0] instanceof Array) de hata veriyor
response.data[0] da sanırım Object. evet bu object
this.kpi_kalite.push(Object.values(response.data[0])) desem aslında
 
Olur gibi gözüküyor, bir deneyin derim
 
axios.get(URL+ "/KPI/").then(response=>{
// console.log(response.data)
// console.log(response.data[0])
// console.log(JSON.parse(JSON.stringify(response.data[0][0])))
this.kpi_kalite.push(Object.values(response.data[0][0]))




for(let i=0;i<response.data[0].length;i++){
this.kpi_kalite.push(Object.values(response.data[0][i]))
console.log(this.kpi_kalite[i])
// console.log(JSON.parse(JSON.stringify((this.kpi_kalite[0])[1])))

}
// localStorage.setItem("kpi_kalite",this.kpi_kalite)
this.renderChildComponent = true;
 
12:58 PM
response.data[0] array değilse response.data[0].length undefined olur
 
Şimdi bir toplantıya gireceğim cevabınızı göremem bu link üzerinden konuşma devam edebiliyor mu? Yani tekrar girsem bir süre sonra size yanıt gönderebilir miyim? Daha önce kullanmadığım için bilmiyorum kusura bakmayın
 
Ben de ilk defa kullanıyorum :) Buradan yazdığınız zaman daha sonra görebilirim.
 
Tamam çok teşekkürler, ilgilenirseniz daha sonra online olacağım? İlgilendiğiniz gerçekten çok teşekkür ediyorum :)
 
1:22 PM
:)) Rica ederim, saat 5'ten sonra bugün online olamayacağım ama yarın sabah 9:30'dan sonra online olacağım. O zaman siz de online olursanız devam edebiliriz.
 
 
5 hours later…
5:56 PM
Tabiki ,yarın görüşmek üzere. :)
 

  last day (78 days later) »