前端代码
<ul class="sign"> <li><input type="text" placeholder="手机号" v-model="loginUser.phone"></li> <li><input type="password" placeholder="密码" v-model="loginUser.password"></li> <li class="sign-check"><input type="text" id="checkText" v-model="loginUser.code" class="checkText" placeholder="验证码"><span class="checkCode" style="background: none;"><img :src="picCode" alt="" style=" 100%;height: 100%;"></span><span class="notsee" @click="updatePicCode">看不清楚,换一张</span></li> <li><span class="submit" @click='userLogin'>登录</span></li> <li><span class="forgetPwd color" @click="loginIndex='1'">忘记密码</span><span class="color dialogin" @click="loginIndex='2'">点击注册</span></li> <li><em></em><span class="otherSign">使用第三方账号登录</span><em></em></li> <li><img src="../img/weixin.png"><img src="../img/QQ.png"></li> </ul>
js代码
new Vue({ el:'#app', data:{ navData:[], banImgData:[], mainData:[], navIdArr:[], navNameArr:[], bannerData:[], labelArr:[],//标签数组 【 ID=》 name】 timer:"", index:"", navid:'', navtype:'', cityId:'0', labelFArr:[], laeblSArr:[], laeblTArr:[], isShowAllSortIndex:0, loginIndex:'-1', picCode:'', loginUser:{ phone:'', password:'', code:'' },
mounted:function() {
this.$nextTick(function(){
this.renderView();
if(this.bannerData.length>0){
this.active();
}
})
},
methods:{
/**
* 用户登录
*/
userLogin:function(){
var body=this.loginUser;
this.$http.post(ajaxAddress.preFix+ajaxAddress.user.login,{},{params:body})
.then(function(res){
console.log(res);
})
},
v-model="a.b" 在JS中声明类A,类A的B属性,@click="方法名",触发登录函数,==同于onclick