再現が難しいのでコード全体を載せてみませんか？
0Like
Vue.js emitの基本的な使い方についてお伺いしたいです。
Q&AClosed
emitの使い方について質問です。
現在Vue.js３を用いて入力フォームの実装をしています。
「入力完了」ボタンを押下したタイミングで子コンポーネント「Buttons」の「toConfirm」イベントを発火させ、
変数「page」をinputからconfirmに変更することで
v-ifを用いたページの切り替えを成功させたく思っています。HTML部分
<buttons :page="page" @to-confirm="page ='confirm' />
とするとうまく切り替わるのですが
<buttons :page="page" @to-confirm="page ='confirm' />
としてmethods部分に
confirm(){
page ='confirm'
}
と書くと
Uncaught ReferenceError: page is not defined
とエラーが出てきてしまいます。
他にも複数イベントを書きたいのでmethodsを利用したコードを書きたいのですが
うまく行かず困っています。
原因についてご教授いただけるととても嬉しいです。
親コンポーネントの該当コードは以下になります。
<script>部分
export default {
name: "・・・・・",
components: { ・・・・・・・},
props: {
page: {
type: String,
default: 'input'
}
},
・・・・・
HTML部分
<terms v-if = "page =='input'" />
<buttons :page="page" @to-confirm="confirm" />//この部分です
0
2Answer
Comments
@honapon
Questioner回答ありがとうございます！
今回は解決に至りましたが、皆様が再現することを考えていなかったので全体を載せるようにしたいと思います。
エスパーします！
おそらく使われているのはOptions APIだと思われるので
confirm() {
this.page = 'confirm'
}
とするとどうでしょうか👀
0Like