搭建初步框架

src/pages/index/IndexPage.vue

@@ -0,0 +1,38 @@
+<template>
+  <div class="hello">
+    <el-input placeholder="请输入用户名" v-model="username" clearable> </el-input>
+    <el-input placeholder="请输入密码" v-model="password" show-password></el-input>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "IndexPage",
+  props: {
+    
+  },
+  data() {
+    return {
+      username: '',
+      password: ''
+    }
+  }
+};
+</script>
+
+<style scoped>
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

src/pages/login/Login.vue

@@ -1,32 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'HelloWorld',
-  props: {
-    msg: String
-  }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

src/pages/login/LoginPage.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="hello">
+    <el-input placeholder="请输入用户名" v-model="username" clearable> </el-input>
+    <el-input placeholder="请输入密码" v-model="password" show-password></el-input>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "LoginPage",
+  data() {
+    return {
+      username: '',
+      password: ''
+    }
+  }
+};
+</script>
+
+<style scoped>
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

src/pages/login/RegisterPage.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="hello">
+    <el-input placeholder="请输入用户名" v-model="username" clearable> </el-input>
+    <el-input placeholder="请输入密码" v-model="password" show-password></el-input>
+    <el-input placeholder="请确认密码" v-model="password2" show-password></el-input>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "RegisterPage",
+  data() {
+    return {
+      username: '',
+      password: '',
+      password2: ''
+    }
+  }
+};
+</script>
+
+<style scoped>
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>