浅谈前后台交互

作者: 孙静静 | 来源:发表于2017-12-08 10:35 被阅读198次

    最近做一个电商商城的项目,和后台的交互成了这个项目的重点,也只是略懂皮毛,交互中的某一种方法,在此记录下。
    和后台的交互首先是和后台的交流,还好我们的后台首先是个好脾气的几个年轻人,不管我们的交流出现什么问题,大家都可以和和气气的说话(论好脾气后台的重要性,嘿嘿)。
    在万般讨论后,他们传过来的数据是这样的:


    image.png

    可以看出来传过来的json串是有点问题,出现这种情况,需要用到正则表达式进行替换解析

        var reg = /\\/g;
        data.replace(reg,"");
        data = data.replace("\"dataInfo\":\"","\"dataInfo\":");
        data = data.replace("\",\"state\":",",\"state\":");
        data = JSON.parse(data);
    

    输出为


    image.png

    这样就解析成了对象,可以在ajax里正常操作。

    这个项目我们前端小组用的是ES6里的一些方法,先把页面静态生成,再利用标签获取进行操作,最后就是几千行的代码,用几百行的js全部替换,话不多说,举一个模块的例子,直接上代码:
    效果图:


    image.png

    (注:最上面右边部分我只写了一个红石榴)
    首先


    image.png image.png
    image.png
    image.png
    image.png

    最后一个函数


    image.png

    (因为模块最上面一行没有看到数据,所以这里没有动态生成)

    图片路径的方法


    image.png

    最前面部分是服务器地址。

    以此方法,一个从后台调用数据的页面就完成了😄

    相关文章

      网友评论

      本文标题:浅谈前后台交互

      本文链接:https://www.haomeiwen.com/subject/bcwsixtx.html