1 回答

TA貢獻(xiàn)1780條經(jīng)驗(yàn) 獲得超5個(gè)贊
這是 Vue自定義事件的一個(gè)很好的用例。我會(huì)按如下方式更新您的代碼:
#登錄模板
...
<div class="login-footer">
<slot name="footer">
<div class="change-mode">
<button class="change-mode-reg" @click="changeModal">Sign up</button>
<div class="change-mode-line"></div>
</div>
</slot>
</div>
...
登錄組件
Vue.component('login', {
template: '#login-template',
data() {
return {
loginInput: '',
passwordInput: ''
}
},
methods: {
sendRequest(e) {
//code not here
},
changeModal() {
this.$emit('change');
}
}
});
#應(yīng)用程序
<div id="app">
<login v-if="showLogin" @close="showLogin = false" @change="changeModal"></login>
<signup v-if="showSignup" @close="showSignup = false"></signup>
</div>
這是一個(gè)更新的小提琴。
(注意:看起來(lái)您在這里可能還有其他一些問(wèn)題,但這可以解決您的模式切換問(wèn)題。)
添加回答
舉報(bào)