• React Native(十一)——删除事件以及刷新列表


            需求:删除列表中的某一项,但不刷新整个页面,底下的数据顺势而上(第一张是原始数据,第二张是删除掉“你会介今年”这条动态后显示的数据)。

    0601

    0602

            中间的过程比较曲折,只因为刚开始的时候自己只想着实现功能,却没考虑到适应之前版本原有的效果,于是就有了三个版本的实现方法:

    let listdata = await deldata(item.id);//请求删除接口返回的数据 
    let list = this.state.list;//原有列表数据
    

    let newlist = new Array();//fsdfks 为空数组,存放删除后剩下的数据组成的新数据

    this.setState({ list: newlist });//list为动态列表的数据集合,重新赋值

    ①版本一:

    this.setState({ list: newlist });//list为动态列表的数据集合,重新赋值
                                    //在循环中使用setState赋值,总是导致页面一闪一闪,不稳定

    0606

    ②版本二

    //调用删除接口直接返回后再调用刷新页面的方法,导致的后果就是真个页面都刷新了,与之前要求的删除某一条数据只是让它在动态列表消失不见(并非刷新整个页面)的愿景背道而驰

    0604

    Refresh ===>为全局函数,刷新整个页面的作用。

    0605

    ③版本三

    //使用js中的splice方法,并把赋值一句放在整个循环的外层
    

    0607

    0603

    纵览:经过一番波折最终实现了需求,虽然没能一次到位,但依旧从中学到了点。

    继续加油~

  • 相关阅读:
    MVC案例之新增与修改Customer
    MVC案例之模糊查询与删除
    MVC案例之多个请求对应一个servlet
    MVC案例
    MVC设计模式-查询与删除
    JSP指令 & 中文乱码问题
    域对象的作用范围 & 请求的转发和重定向
    JSP
    HttpServlet
    istio-ingress网关安全
  • 原文地址:https://www.cnblogs.com/zhengyeye/p/7992236.html
Copyright © 2020-2023  润新知