npm install vue-router

npm install --save axios

npm install vuex --save

npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass

npm i element-ui -S

import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import VueRouter from 'vue-router'
import Vuex from 'vuex'
Vue.use(ElementUI)
Vue.use(VueRouter)
Vue.use(Vuex)

new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>',
})

export default new Router({

  routes: [
    {
      path: '/',
      name: 'Login',
      component: Login,
    },
    {
        path: '/Forget',
        name: 'Forget',
        component: Forget,
    },
    {
      path: '/',
      component: Home,
      name: '用户管理',
      children: [
          { path: '/User', component: User, name: '用户'},
          { path: '/SeeEdit', component: SeeEdit, name: '用户详情'},
          { path: '/Modify', component: Modify, name: '修改用户资料'},
          { path: '/changepsw', component: changepsw, name: '修改密码'},
      ]
    },
    ......
   ],

})

export default new Router({

  routes: [
      ......
  ],
  scrollBehavior (to, from, savedPosition) {
       // console.log(to) // to：要进入的目标路由对象，到哪里去
       // console.log(from) // from：离开的路由对象，哪里来
       // console.log(savedPosition) // savePosition：会记录滚动条的坐标
       if(savedPosition) {
          return savedPosition;
       }else{
          return {x:0,y:0}
       }
  }

})

//设置cookie
export function setCookie(key,value) {
    var Days = 0.6;
    var exdate = new Date(); //获取时间
    exdate.setTime(exdate.getTime() + Days*24*60*60*1000); //保存的天数
    //字符串拼接cookie
    window.document.cookie = key + "=" + value + ";path=/;expires=" + exdate.toGMTString();
  };
  //读取cookie
  export function getCookie(param) {
    var c_param = '';
    if (document.cookie.length > 0) {
      var arr = document.cookie.split('; '); //这里显示的格式需要切割一下自己可输出看下
      for (var i = 0; i < arr.length; i++) {
        var arr2 = arr[i].split('='); //再次切割
        //判断查找相对应的值
        if (arr2[0] == param) {
          c_param = arr2[1];
          //保存到保存数据的地方
        }
      }
      return c_param;
    }
  };
  
  function padLeftZero (str) {
    return ('00' + str).substr(str.length);
  };

//cookie
import {setCookie,getCookie}from '../router/cookieUtil'

//储存用户信息
setCookie('sellerId', this.information.sellerId);
//取值用户信息
this.sellerId = getCookie("sellerId");

<button @click="Signout">退出</button>

mounted () {
      this.sellerId = getCookie("sellerId");
      if (this.sellerId==undefined||this.sellerId=="") {
            this.$router.push('/')
      } else {
                
      }
},
methods: {
      //退出
      Signout(){
          setCookie("sellerId", "", -1);
          this.$router.push('/')
      },
}

<el-button :disabled="disabled" @click="sendcode" class="sendcode">{{btntxt}}</el-button>

export default {
        data() {
            return {
                disabled:false,
                time:0,
                btntxt:"发送验证码",
            };
        },
        methods: {
            //发送手机验证码倒计时
            timer() {
                if (this.time > 0) {
                     this.time--;
                     this.btntxt=this.time+"s后重新获取";
                     setTimeout(this.timer, 1000);
                } else{
                     this.time=0;
                     this.btntxt="发送验证码";
                     this.disabled=false;
                }
            },
        }
}

<div v-bind:style="{width: myWidth,height: myHeight}"></div>

export default {

        data() {
            return {
                myWidth: (window.innerWidth - 240) + 'px',
                myHeight: (window.innerHeight - 100) + 'px',
            };
        },

}

<span class="time">{{nowTime}}</span>

export default {

        data() {
            return {
                nowTime:"",
                nowWeek:"",
            };
        },
        
        // 创建完成时
        created() {
            this.nowTimes();
        },

        methods: {
       
            //当前时间
            timeFormate(timeStamp) {
                let year = new Date(timeStamp).getFullYear();
                let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1;
                let date =new Date(timeStamp).getDate() < 10? "0" + new Date(timeStamp).getDate(): new Date(timeStamp).getDate();
                var week = timeStamp ? new Date(timeStamp) : new Date();
                if(week.getDay() == 1){
                    this.nowWeek="周一"
                } else if(week.getDay() == 2){
                    this.nowWeek="周二"
                } else if(week.getDay() == 3){
                    this.nowWeek="周三"
                } else if(week.getDay() == 4){
                    this.nowWeek="周四"
                } else if(week.getDay() == 5){
                    this.nowWeek="周五"
                } else if(week.getDay() == 6){
                    this.nowWeek="周六"
                } else {
                    this.nowWeek="周日"
                }
                let hh =new Date(timeStamp).getHours() < 10? "0" + new Date(timeStamp).getHours(): new Date(timeStamp).getHours();
                let mm =new Date(timeStamp).getMinutes() < 10? "0" + new Date(timeStamp).getMinutes(): new Date(timeStamp).getMinutes();
                this.nowTime = year + "/" + month + "/" + date +"  "+ this.nowWeek +"  "+ hh +":"+ mm ;
                // console.log(this.nowTime)
                clearInterval(this.Times);
            },
            
            // 定时器函数
            nowTimes(){
                this.timeFormate(new Date());
                this.Times=setInterval(this.nowTimes,1000);
            },

        },

    }

<div class="right-select">
         <ul>
                 <li>张三1</li>
                 <li>张三2</li>
                 <li>张三3</li>
                 <li>张三4</li>
                 <li>张三5</li>
                 <li>张三6</li>
                 <li>张三7</li>
         </ul>
</div>

    .right-select{
        width: 500px;
        height: 105px;
        overflow-y: scroll;
        border: 1px solid #bbbbbb;
        border-radius: 5px;
        margin-left: 65px;
    }
    .right-select::-webkit-scrollbar {
        width: 12px;
        background-color: #fff;
    }
    .right-select::-webkit-scrollbar-thumb {
        height: 26px;
        background-color: #666;
        border-radius: 50px;
    }

    .right-select::-moz-scrollbar {
        width: 12px;
        background-color: #fff;
    }
    .right-select::-moz-scrollbar-thumb {
        height: 26px;
        background-color: #666;
        border-radius: 50px;
    }

<ul>
     <li  v-for="(item,index) in list" :key="item.id" >
          <p class="p1">{{ index+1>9?index+1:"0"+(index+1) }}</p>
          <p class="p2">{{ item.name }}&nbsp;&nbsp;{{ item.id }}&nbsp;&nbsp;{{ item.source }}</p>
     </li>
</ul>

list: [{
     name: '张一',
     id: '1241',
     source: '经销商',
},{
     name: '张二',
     id: '1242',
     source: '业务员',
},{
     name: '张三',
     id: '1243',
     source: '普通用户',
},{
     name: '张四',
     id: '1244',
     source: '商城',
}],

<form :model="reportForm">
        <input type="text" v-model="reportForm.name" placeholder="姓名"/>
        <input type="text" v-model="reportForm.sex" placeholder="性别"/>
        <input type="text" v-model="reportForm.age" placeholder="年龄"/>
</form>
<button @click="sub"></button>

export default {
    data() {
        return {
              reportForm: {
                  name: '',
                  sex:'',
                  age: '',
              }
        }
    },
    methods: {
       sub() {
               let reportdata = this.reportForm;
               console.log(reportdata)
       }
    }
}