vue.js实现用户评论、登录、注册、及修改信息功能

vue.js实现用户评论、登录、注册、及修改用户部分信息功能代码。效果图如下：

登入后：

登入前：

登录框:

注册框：

html代码部分：

index

用户登录

<!--注册-->
<div class="loginbox registerbox" v-show="registerStatus" @click="registerboxClick()" style="display:none;"&gt;
  <div class="box" @click="stopProp()"&gt;
    <h3>用户注册</h3>
    <form name="register" id="register"&gt;
      <input type="text" placeholder="请输入用户名" class="username"&gt;
      <input type="password" placeholder="请输入登录密码" class="psw"&gt;
      <input type="button" value="立即注册" @click="register()"&gt;
      <input type="button" value="立即登录" @click="showLogin()" class="blueBtn"&gt;
    </form>
  </div>
</div>
<!--注册-->

<!--评论-->
<div class="commentbox"&gt;
  <div class="userbar" v-show="userbarStatus" style="display:none;"&gt;
    <img :src="'img/'+currentUser.userimg" alt="" title="" class="userimg"&gt;
    <span class="loginout" @click="loginout()"&gt;退出账号<i class="icon-style icon-signout"&gt;</i></span>
    <span class="username" v-text="currentUser.username"&gt;<i class="icon-style icon-user-md"&gt;</i></span>
    <p><span class="userword" v-text="currentUser.words" contenteditable="false"&gt;</span><i class="icon-style icon-edit" @click="editUserWords()"&gt;</i></p>
  </div>
  <div class=" commemtlist "&gt;
    <dl v-for="(value,index) in comments "&gt;
      <dt>
        <img :src=" 'img/'+value.userimg "&gt;
        <span class="username "&gt;{{value.username}}</span>
      </dt>
      <dd class="commentwords "&gt;<i class="icon-style icon-file-alt "&gt;</i>{{value.words}}</dd>
      <dd class="btbar "&gt;
        <span class="like red "&gt;<i class="icon-style icon-thumbs-up "&gt;</i>点赞(<h3 @click="like(index) "&gt;{{value.like}}</h3>)</span>
        <span class="notlike red "&gt;<i class="icon-style icon-thumbs-down "&gt;</i>点踩(<h3 @click="notlike(index) "&gt;{{value.nolike}}</h3>)</span>
        <span class="data red "&gt;<i class="icon-style icon-calendar "&gt;</i>时间<h3>{{value.time}}</h3></span>
      </dd>
    </dl>
    <div class="wordsbox "&gt;
      <textarea placeholder="请输入留言 "&gt;</textarea>
      <span @click="showLogin()" v-show="lrBtnStatus"&gt;登录</span>
      <span @click="showregister()" v-show="lrBtnStatus"&gt;注册</span>
      <input type="submit" value="提交 " @click="subCommont()" />
    </div>
  </div>
</div>
<!--评论-->