企业官网建设流程全解析

一、form表单注意事项

<template><divclass="container"><el-form:model="form"label-width="80px":rules="RulesName"ref="loginForm"><el-form-itemlabel="姓名"prop="username"><el-inputv-model="form.username"></el-input></el-form-item><el-form-itemlabel="密码"prop="password"><el-inputv-model="form.password"></el-input></el-form-item><el-form-itemlabel="确认密码"prop="confirm"><el-inputv-model="form.confirm"></el-input></el-form-item><el-form-itemlabel=""><el-buttontype="primary"@click="onsubmit()">login</el-button></el-form-item></el-form></div></template><script>exportdefault{// eslint-disable-next-line vue/multi-word-component-namesname:'test',data(){// 注意：必须在data函数里定义此箭头函数，才能确保this.from使用constsamePwd=(rule,value,callback)=>{if(value!==this.form.password){// 如果验证失败，则调用 回调函数时，指定一个 Error 对象。callback(newError('两次输入的密码不一致!'))}else{// 如果验证成功，则直接调用 callback 回调函数即可。callback()}}return{form:{username:'',password:'',confirm:''},RulesName:{username:[{required:true,message:'请输入',trigger:'blur'},{pattern:/^[a-zA-Z0-9]{1,10}$/,message:'用户名必须是1-10的大小写字母数字',trigger:'blur'}],passwordRule:[{required:true,message:'请输入',trigger:'blur'},{min:3,max:5,message:'长度3-5',trigger:'blur'}],confirm:[{required:true,message:'请输入',trigger:'blur'},{pattern:/^[a-zA-Z0-9]{1,10}$/,message:'用户名必须是1-10的大小写字母数字',trigger:'blur'},{validator:samePwd,trigger:'blur'}]}}}}</script>

二、前后端数据交互

可以数据交互了，那就使用axios，那么在此直接使用axios真的好吗？
答：肯定不行
我们每次发起一个http请求都要写基地址（如：http://localhost:8080）那就重复切烦人
如果基地址变化了也很烦人
而且我们发请求需要携带一些token的，每次发起请求都要携带，那也很烦人
so需要对axios进行封装

三、分页

四、表格