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作為一個對象提交上去就行;


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM