Postingan lainnya
$refs undefined Vue JS
kenapa pas jalanin methods di v-on:click
console.log(this.$refs.[nama ref])
selalu undefined, apakah pengaruh dari v-if ?
6 Jawaban:
Di htmlnya udah kasi ref="nama" belum? This nya mungkin yg pindah ke sub function. Code lengkapnya gmana?
Ini kode yang udah jalan gan
<div class="smsgateway-1">
<span class="torm"
v-bind:class="{active: !pesan}"
v-on:mousedown="pesan = false">Nomor Telepon</span>
<span class="slash">/</span>
<span class="torm"
v-bind:class="{active: pesan}"
v-on:mousedown="pesan = true"
v-on:mouseup="focus()">Pesan</span>
</div>
<div class="smsgateway-2">
<div class="notelp" v-if="!pesan">
</div>
<div class="pesan" v-else>
<textarea v-model="textArea" ref="pesan"></textarea>
</div>
</div>
di kode bagian ini gan
// yang ini bener
<span class="torm"
v-bind:class="{active: pesan}"
v-on:mousedown="pesan = true"
v-on:mouseup="focus()">Pesan</span>
// tadinya begini, gk bisa2 focus() nya. musti klik nya 2x baru ngefokus karena refs nya undefined
<span class="torm"
v-bind:class="{active: pesan}"
v-on:click="pesan = true, focus()">Pesan</span>
nah yg kode diatas yg ke2 g bekerja gan, walaupun masalahnya udah selesai pas diganti mousedown dan mouseup, tapi ane masih gretan gan pengen tau solusinya.
ini javascriptnya
var app = new Vue({
el: '.smsgateway',
data: {
pesan: false
},
methods: {
focus: function() {
this.$refs.pesan.focus();
}
}
})
Abis ane edit gan yang diatas biar lebih ringkas
Apa pengaruh di v-if nya ya? kan elementnya belum kebuat jd gk tau ref="pesan" itu yang mana
harusnya sih ngga pengaruh v-if gan. kan waktu mousedown udah ditampilin, jadi waktu mouseup harusnya dah kebaca. pasang di jsfiddle coba gan
Jawaban Terpilih
Iya udah fix gan pake mousedown dan mouseup
// yang ini gak berhasil
<span class="torm"
v-bind:class="{active: pesan}"
v-on:click="pesan = true, focus()">Pesan</span>
// yang ini udah berhasil
<span class="torm"
v-bind:class="{active: pesan}"
v-on:mousedown="pesan = true"
v-on:mouseup="focus()">Pesan</span>