VUE v-model双向绑定数据延迟展示点别的才展示出来

最新推荐文章于 2024-07-24 15:39:11 发布

叶中叶

最新推荐文章于 2024-07-24 15:39:11 发布

阅读量215

点赞数 1

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/a7564951/article/details/139310392

版权

1、问题描述

VUE v-model双向绑定，

        <el-form-item label="累计积分" prop="addIntegral">
          <el-input v-model="formLog.addIntegral" placeholder="请输入累计积分" @blur="addIntegralBlur"/>
        </el-form-item>

@blur="addIntegralBlur" 使用改变事件触发，取到本次输入在加上固定值计算结果放到另外一个输入框里的功能。

每次修改数据延迟展示点别的才展示出来，或者再次修改之后显示上次修改的结果

2、问题分析

有可能是因为页面渲染的时候，数据还没有加载，导致绑定失败

3、解决办法

所以给计算过程前后加了一个loading事件，等待结算完成在渲染页面

    addIntegralBlur(){
      if(this.formLog.addIntegral != null){
        this.loading = true;
        this.formLog.newIntegral = (parseInt(this.formLog.addIntegral) + parseInt(this.formLog.memberIntegral));
        this.loading = false;
      }

    }

问题解决