vue增删改查,加过分页后,我编辑就不管使了。默认是切分了接口数据给分页。

编辑无法改变数据表原有的值,越看越迷。我编辑之后是应该在获取接口的数据改变还是啥?
编辑把数据现在有的6份分割成两份,row直接获取这个订单也不能该原来这个数据在数据表原有的位置
image.png

按钮:
image.png

编辑/新增组件
image.png

子组件保存,motify是父组件传过来的值
image.png

分页html:

<!-- 订单列表分页 -->
      <div class="order-btn-box">
        <van-pagination
          v-model="currentPage"
          @change="handleCurrentChange"
          :items-per-page="pageSize"
          :total-items="totalItems"
          mode="simple"
        />
      </div>

data数据:
image.png

接收接口数据:


 mounted() {
    this.getData();
  },

 getData() {
      // let name = this.$store.state.name;
      this.$api.users
        .getUser({
          account: this.userID,
        })
        .then((data) => {
          this.$store.state.name = data.nickName;
        });
      let yy = new Date().getFullYear(),
        mm = new Date().getMonth() + 1,
        dd = new Date().getDate();
      if (mm < 10) {
        mm = `0${mm}`;
      }
      if (dd < 10) {
        dd = `0${dd}`;
      }
      this.nowDate = `${yy} 年 ${mm} 月 ${dd} 日`;
      this.dates = `${yy}-${mm}-${dd} - ${yy}-${mm}-${dd}`;
      this.$api.oderData
        .getList({
          userName: this.$store.state.name,
          date: this.dates,
        })
        .then((data) => {
          this.totalItems = data.total || 0;
          this.reportList = data.data || [];
          console.log(this.reportList)
          console.log(this.totalItems)
          if (this.totalItems > this.pageSize) {
            for (let index = 0; index < this.pageSize; index++) {
              this.form.push(this.reportList[index]);
            }
            console.log(this.form)
          } else {
            this.form = this.reportList.map((item) => item);
            console.log(this.form)
          }
        });
    },
    

分页处理部分:

 // 分页处理
 currentChangePage(list) {
      let num = (this.currentPage - 1) * this.pageSize;
      let to = this.currentPage * this.pageSize;
      this.form = [];
      for (; num < to; num++) {
        if (list[num]) {
          this.form.push(list[num]);
        }
      }
    },
    //
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage = val;
      //需要判断是否检索
      //if (!this.js) {
      //  this.currentChangePage(this.reportList);
      //} else {
      //  this.currentChangePage(this.filterReportList);
      //}
    },

页面编辑处理

// 页面编辑
    editData(row,key) {
      this.showEdit = true;
      console.log(row,key)
      this.modify = row;
    },
阅读 1.6k
1 个回答

恩,问题的描述让我迷茫,
我猜大约是这样?

有一个表格 Table 或者 列表,
然后用户修改数据,并保存之后数据没有刷新?

建议重复 Search 操作,刷新数据重复渲染
虽然我还是不太明白你的具体问题 ..

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题