一、问题描述

每次刷新页面，下面的内容就会一闪而过。

一闪而过后恢复正常：

二、解决

问题代码：

@*修改密码*@

@*{{myWord.personInfo}} *@

改为v-html，在iveiw中方法执行后赋值。

data : {

myWord:{

personInfo: '个人信息',

changePassword: '修改密码',

submit: '提交',

cancel: '取消'

},

同样的问题还出现在很多地方。

三、完整代码：

@{

ViewBag.Title = "个人中心";

Layout = "~/Views/Shared/_LayoutNotFooter.cshtml";

}

.main-container {

overflow-y: hidden;

}

var vmUserInfo = new Vue({

el: '#personalCenterDiv',

data : {

modal1: false,

// modal2: false,

formValidate: {

UserName: '',

RealName: '',

Company: '',

BirthDate: '',

Phone: '',

TelPhone: '',

Address: '',

TypeID: ''

},

myWord:{

personInfo: '个人信息',

changePassword: '修改密码',

submit: '提交',

cancel: '取消'

},

formPassword: {

OldPassword: '',

Password: '',

Password2: ''

},

ruleValidate: {

UserName: [

{ required: true, message: '用户名不能为空！', trigger: 'blur' }

],

RealName: [

{ required: true, message: '真实姓名不能为空！', trigger: 'blur' }

],

Company: [

{ required: true, message: '工作单位不能为空！', trigger: 'blur' }

],

BirthDate: [

{ required: true, type: 'date', message: '出生日期不能为空！', trigger: 'change' }

],

Phone: [

{ required: true, message: '手机号不能为空！', trigger: 'blur' }

],

TelPhone: [

{ required: true, message: '固定电话不能为空！', trigger: 'blur' }

],

Address: [

{ required: true, message: '联系地址不能为空！', trigger: 'blur' }

]

},

ruleformPassword: {

OldPassword: [

{ required: true, message: '原密码不能为空！', trigger: 'blur' }

],

Password: [

{ required: true, message: '新密码不能为空！', trigger: 'blur' }

],

Password2: [

{ required: true, message: '确认密码不能为空！', trigger: 'blur' }

]

}

},

created: function () {

},

methods: {

handleSubmit:function(name) {

var that = this;

this.$refs[name].validate(function(valid) {

//console.dir(valid);

//非空校验通过

if (valid) {

var getData = {

UserName: that.formValidate.UserName,

RealName: that.formValidate.RealName,

Company: that.formValidate.Company,

BirthDate: that.formValidate.BirthDate,

Phone: that.formValidate.Phone,

TelPhone: that.formValidate.TelPhone,

Address: that.formValidate.Address

}

//console.dir(getData);

that.$http.post('@Url.Action("SetLoginUserInfo", "Account")', getData).then(function (result) {

if (result.data.success) {

that.instance("success", "提交成功！");

}

else {

that.instance("error", "提交失败！");

}

}, function (response) {

});

} else {

that.instance("warning", "不能存在空值！")

}

})

},

handleReset: function(name) {

this.$refs[name].resetFields();

window.location = '/Ecology';

},

okClick: function(name) {

var that = this;

//非空校验

this.$refs[name].validate(function (valid) {

// console.dir(valid);

if (valid) {

var getData = {

UserName: that.formValidate.UserName,

OldPassword: that.formPassword.OldPassword,

Password: that.formPassword.Password,

Password2: that.formPassword.Password2

}

// console.dir(getData);

that.$http.post('@Url.Action("SetUserPassword", "Account")', getData).then(function (result) {

// console.dir(result.data.msg);

if (result.data.success) {

that.instance("success", result.data.msg);

;

}

else {

// console.log("error:SetUserPassword");

that.instance("error", result.data.msg);

}

}, function (response) {

});

} else {

that.instance("warning", "三者都不能为空！");

}

});

//vmUserInfo.formPassword.OldPassword = '';

//vmUserInfo.formPassword.Password = '';

//vmUserInfo.formPassword.Password2 = '';

//删除密码信息

this.$refs[name].resetFields();

},

cancelClick: function (name) {

this.$refs[name].resetFields();

},

instance: function (type, message) {

const title = '提示信息:';

const content = '

' + message + '

';

switch (type) {

case 'info':

this.$Modal.info({

title: title,

content: content

});

break;

case 'success':

this.$Modal.success({

title: title,

content: content

});

break;

case 'warning':

this.$Modal.warning({

title: title,

content: content

});

break;

case 'error':

this.$Modal.error({

title: title,

content: content

});

break;

}

}

},

mounted: function () {

var that = this;

that.$http.post('@Url.Action("GetLoginUserInfo", "Account")', {}).then(function (result) {

// console.dir(result);

if (result.data.success == true) {

if (result.data.rows != undefined && result.data.rows != null) {

if (result.data.rows.TypeID != null) {

if (result.data.rows.TypeID == 1) {

vmUserInfo.formValidate.TypeID = "普通用户";

} else if (result.data.rows.TypeID == 2) {

vmUserInfo.formValidate.TypeID = "管理员";

}

}

vmUserInfo.formValidate.UserName = result.data.rows.UserName;

vmUserInfo.formValidate.RealName = result.data.rows.RealName;

vmUserInfo.formValidate.Company = result.data.rows.Company;

vmUserInfo.formValidate.BirthDate = result.data.rows.BirthDate;

vmUserInfo.formValidate.Phone = result.data.rows.Phone;

vmUserInfo.formValidate.TelPhone = result.data.rows.TelPhone;

vmUserInfo.formValidate.Address = result.data.rows.Address;

}

} else {

// console.log("error:GetLoginUserInfo");

}

}, function (response) {

});

}

});