Vue

by zoomieos

Vue

<template>
    <f7-page no-toolbar no-navbar no-swipeback login-screen>
        <f7-login-screen-title>Create account</f7-login-screen-title>

        <f7-list form>
            <f7-list-item>
                <f7-label>Email</f7-label>
                <f7-input type="text" v-model="email" placeholder="Email"></f7-input>
            </f7-list-item>
            <f7-list-item>
                <f7-label>Password</f7-label>
                <f7-input type="password" v-model="password" placeholder="Password"></f7-input>
            </f7-list-item>
        </f7-list>
        <f7-list>
            <f7-list-button @click="signUp">Sign Up</f7-list-button>
            <f7-list-button link="/">Back</f7-list-button>
        </f7-list>
    </f7-page>
</template>
<script>
    import { f7Page, f7LoginScreenTitle, f7List, f7ListItem, f7Label, f7Input, f7ListButton, f7BlockFooter } from 'framework7-vue';
    import firebase from 'firebase';
    export default {
        components: {
            f7Page,
            f7LoginScreenTitle,
            f7List,
            f7ListItem,
            f7Label,
            f7Input,
            f7ListButton,
            f7BlockFooter,
        },
        data() {
            return {
                email: '',
                password: '',
            };
        },
        methods: {
            signUp: function () {
                firebase.auth().createUserWithEmailAndPassword(this.email, this.password).then(
                    function (user) {
                        console.log('Account created');
                    },
                    function (err) {
                        console.log('Ooops ' + err.message)
                    }
                )
            },

        }
    }
</script>