Vue.js emitの基本的な使い方についてお伺いしたいです。
Q&A
Closed
emitの使い方について質問です。
現在Vue.js3を用いて入力フォームの実装をしています。
「入力完了」ボタンを押下したタイミングで子コンポーネント「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