antd 根據後台資料動態生成表單和資料更新

具體需求是：

1 根據後台資料動態生成表單項

2 表單項可以編輯和增減，提交儲存資料到後台

大概介面如下：

對於需求1，找了下基本通過map列舉，配合getfielddecorator

沒找到完整的解決方案，自己摸索了下，通過onvalueschange監聽所有表單改動，更新state來儲存實時編輯的.

還有乙個問題是，對於編輯過的表單，即使資料更新了，表單還是不會重新整理（重新渲染），如在tab切換時，因為所有兩個tab的key是一樣的，如果在左邊某個表單做了編輯，切換到右邊tab時，對應的表單就不會資料變化了，如下：

下面是實現的**：

元件載入完後去獲取後台資料：

componentdidmount()  = this.props;

const  = this.state;
dispatch(,
});}

render()  else if (typeof value === 'number')  else 

};const ,
loading,
} = this.props;
const  = this.props.form;
return (
title="佣金設定"
content="佣金規則最少兩條，**必須遞增，最後一條規則為佣金上限"
>);

addtag()  = this.props;

let data = brokage.table.data || ;
let count = brokage.table.count || 0;
data = data.concat();
count = count + 1;
dispatch(,
});}

effects: , ) );

},....
reducers: , );
return ,};}
return ;
},....

removetag(index)  = this.props;

let data = brokage.table.data;
let count = brokage.table.count;
if (count === 0 || data.length === 0) 
// can use data-binding to set
data.splice(index, 1);
count = count - 1;
dispatch(,
});}

@form.create( = props;

let data = ;
let count = brokage.table.count;
for (let i = 0; i < count; i++) `], max: allvalues[`price$`] });
}// 更新state
dispatch(,
});},
})

handchangepane(key) = this.props;

//重置表單
this.props.form.resetfields();
let activekey=0;
if(key=="1")else
this.setstate();
settimeout(function(),
});},10);
}

React根據後台資料動態生成Form表單

import react,from react import reactdom from react dom import from antd import moment from moment 推薦在入口檔案全域性設定 locale import moment locale zh cn momen...

選單欄根據後台資料自動生成

最近遇到乙個問題 需要給個人分許可權檢視不同的選單 以前許可權問題是定義乙個資料庫表 根據許可權不同賦予不同的許可權 從資料庫獲取選單 比較靈活 所以就做了這個肯定有很多不足 希望可以和大家共同學習 技術 easyui spring spingmvc mybiatis 為什麼要用easyui呢 因為...

Easyui動態載入後台資料的例子

js 介面驗證查詢按鈕 function strategychecksearch else,success function data else strategycheckdg datagrid updaterow controller 根據wget獲取狀態碼 requestparam strate...