お世話になります。
初歩的な質問で恐縮ですが、Vueで下記のように書いた時にテキストエリアで書いた文字をmethodのdoAction内で取得したい時に、「実行」ボタンを押すと、
Cannot read property 'message' of undefined
のエラーメッセージが出るのは何故なのでしょうか。。
初歩的なので逆に原因が分からず混乱しております。。
vue.js
1<template> 2 <div class="message"> 3 <div class="message-area"> 4 <p>{{ message }}</p> 5 </div> 6 <hr> 7 <textarea v-model="message" cols="30" rows="10" /> 8 <button 9 @click="doAction" 10 > 11 実行 12 </button> 13 </div> 14</template> 15 16<script> 17export default { 18 name: 'Message', 19 data: () => { 20 return { 21 message: 'Please Enter ..' 22 } 23 }, 24 methods: { 25 doAction: () => { 26 alert(this.message) 27 } 28 } 29} 30</script>
私も詳しくないけど、export default 部で、頭が大文字になってるからでは?
message => Message
ご回答誠にありがとうございます。
修正してみましたが、、同じ結果のようでした。
調べてみたところ、コンポーネント名はパスカルケースが推奨されているようでした。
文末のセミコロン;必要ですよね?
あれ?違った??
これがですねー。。自分も最初は気持ち悪かったのですが、最近は「要らないだろ」派が席捲してるみたいなんです。。
https://blog.tai2.net/automatic_semilocon_insertion.html
少なくともVueに同梱されいてるEslintを入れるとデフォルト設定ではセミコロンを入れると弾かれます。
ああ、自分の書き方は時代遅れになったのかな、、とその時思いました。
自分も時代遅れですねw
回答1件
あなたの回答
tips
プレビュー