zoukankan      html  css  js  c++  java
  • vue中通过后台返回的只动态生成表单及提交

    在crm系统中,页面中表单内容和表单提交的内容都是不固定的,特别是表单内容不确定;是根据后台的需要配置出来;前台根据接口返回;进行渲染,处理后进行提交,这样在vue中就会出现问题;因为vue中的数据是先渲染后使用;所有的数据必须先生命出来,所以这样就造成了这个问题;

    解决方法:

      1.在请求接口;渲染后台需要提交的表单字段的时候;先对所有的需要渲染和提交的表单字段进行遍历,然后存储到data中一个对象中,我写的对象是subParams,这样就可以把所有需要提交的字段提交到subparams中了;

    or(var ke in content[key]){
                            if(ke=='办理情况'){
                                this.subContent=content[key][ke];
                                for(var i=0;i<this.subContent.length;i++)
                                {
                                    if(this.subContent[i].type=="2")
                                    {
                                        var arr = this.subContent[i].value.split(',');
                                        var arr1 = [];
                                        var arr2 = [];
                                        var j=0;
                                        for(var key1 in arr)
                                        {
                                            if(arr[key1]!="")
                                            {
                                                arr1[j]=arr[key1];
                                                arr2[j] = arr[key1];
                                                j++;
                                            }
                                        }
                                        this.ordList[this.subContent[i].fd_name]=new Array(arr1);
                                        if(arr1.length<=1)
                                        {
                                            this.ordvalue[this.subContent[i].fd_name] = new Array(arr1[0]);
                                        }
                                        
                                    }
                                    else if(this.subContent[i].type=="3")
                                    {
                                        var arr = this.subContent[i].value.split(',');
                                        var arr1 = [];
                                        var arr2 = [];
                                        var j=0;
                                        for(var key1 in arr)
                                        {
                                            if(arr[key1]!="")
                                            {
                                                arr1[j]=arr[key1];
                                                arr2[j] = arr[key1];
                                                j++;
                                            }
                                        }
                                        this.ordList[this.subContent[i].fd_name]=new Array(arr1);
                                    }
                                    else
                                    {
                                        this.subParms[this.subContent[i].fd_name]=this.subContent[i].value;
                                    }
                                    
                                }

    这样的话就可以绑定了;然后根据要求渲染,把对应的表单元素渲染成对应的下过,v-model动态绑定到subParms中的值上;最后提交的时候把subParms作为一个对象提交上去就行;

    希望自己写的东西能够对大家有所帮助!谢谢
  • 相关阅读:
    蓝桥杯 算法提高 11-1实现strcmp函数 (JAVA方法)
    蓝桥杯 算法提高 11-1实现strcmp函数 (JAVA方法)
    Java远程调用邮件服务器,实现邮件发送
    利用命令行来安装应用到android虚拟机
    sql查询语句优化需要注意的几点
    hdu1198--并查集
    处理百万级以上的数据查询提高效率的办法
    EasyMock入门
    百度绿萝算法2.0更新 外链数降低分析
    Memcached 学习笔记(二)——ruby调用
  • 原文地址:https://www.cnblogs.com/mrxinxin/p/11527618.html
Copyright © 2011-2022 走看看