zoukankan      html  css  js  c++  java
  • vue的v-model绑定数据问题

      在我的项目中有一个这样的功能模块:

      我们修改数据全是在前台的table中修改,然后把这个table的值带到后台。(理想:修改值后,点击确认值改变,点击取消值恢复原来的值)那么问题就来了:

    a)你修改值的时候这时候vue 的v-model的双向绑定这个特性就体现出来了。

    所以我们在修改的那个方法中加入

    editDirector(row, _index) {
        let _row = JSON.parse(JSON.stringify(row));
        this.editForm = _row;加入以上两句
        this.selected = _index;这个是我标记修改的是哪一个  在data return定义 selected: -1, //记录修改位置  一个负值就行了
    },

    这时候v-model双向绑定这个特性就没了。

    下面就考虑点击确定就修改,取消则不变:

    在script 引入

    import Vue from 'vue'

    在确定按钮上加上

    Vue.set(this.tbAddManagementChangeRecord, this.selected, this.editForm);
    this.tbAddManagementChangeRecord 这个是table所以的数据,
    this.selected 这个是你所记录要修改table的哪条记录,
    this.editForm 这个是你修改的数据

    在取消按钮不做操作 关闭弹框就行了

    这样功能就完成了

  • 相关阅读:
    Python内存管理机制
    哈希表(散列表)
    Python面向对象三大特性
    Python 面向对象继承
    Python面向对象 类的空间问题
    面向对象初识
    增量式爬虫
    分布式爬虫
    crawlscrapy框架
    HTML
  • 原文地址:https://www.cnblogs.com/chiang28/p/9999806.html
Copyright © 2011-2022 走看看