amis系列开发
amis 是一个低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率
可以在github下载源码：https://github.com/baidu/amis。
可以在爱速搭看教程：https://aisuda.bce.baidu.com/amis/zh-CN/docs/index
其中一个是amis-editor-demo-master，可以部署本地的在线编辑项目；另一个是amis-admin-master，可以搭建网站；
一、搭建本地的在线编辑项目
解压amis-editor-demo-master，选择其中一个版本，双击index.html即可，如果使用nginx配置文件存放在位置即可，比如我选择5.6.2版本，在nginx.conf配置如下：
alias /usr/local/html/demo-5.6.2/;
amis 是一个低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率
可以在github下载源码：https://github.com/baidu/amis。
可以在爱速搭看教程：https://aisuda.bce.baidu.com/amis/zh-CN/docs/index
其中一个是amis-editor-demo-master，可以部署本地的在线编辑项目；另一个是amis-admin-master，可以搭建网站；
一、搭建本地的在线编辑项目
解压amis-editor-demo-master，选择其中一个版本，双击index.html即可，如果使用nginx配置文件存放在位置即可，比如我选择5.6.2版本，在nginx.conf配置如下：
alias /usr/local/html/demo-5.6.2/;
二、快速搭建网站
解压amis-admin-master，
1、文件结构如下：
其中server.js是路由，index.html是主页，没有提供login.html登录页面，以及跳转到主页的方法，需自己做
2、login.html代码基本结构：
amis 初始化一个对象，
amisJSON 定义一个json，可填写网页内容
amis 将amisJSON的内容，渲染到 id 为root的div里面。
<div id="root" class="app-wrapper"></div>
<script type="text/javascript">
(function () {
let amis = amisRequire('amis/embed');
// 通过替换下面这个配置来生成不同页面
let amisJSON = {
};
let amisScoped = amis.embed(
'#root',
amisJSON
);
})();
</script>3、网页内容编辑
使用本地搭建的在线编辑项目，直接拖拽相关元素即可。
4、配置接口请求
api：当前请求的 api 对象，一般包含下面几个属性：
- url：当前接口 Api 地址
- method：当前请求的方式
- data：请求的数据体, 注意当请求方式为
get时，data在传入适配器时会被删除，请通过 query 读取，或者修改 - query：请求的查询参数，所有请求参数都会被合并到 query 中，包含 data 参数和 url 参数
- headers：请求的头部信息
- context: 发送请求时的上下文数据
示例：
api: {
url: 'http://192.168.10.1:8080/system/checklogin',
data: {
"username": "$ {username}",
"password": "$ {password}"
},
method: 'post',
requestAdaptor: function(api){
var password = api.body.password;
api.body.password = hex_md5(password);
return api;
},
adaptor: function (payload, response, api) {
/*
payload返回的就是magic api返回的结果
登录成功后，将token和username放到本地缓存
*/
if (payload.data != null) {
localStorage.setItem('username',payload.data.username);
localStorage.setItem('nickname',payload.data.nickname);
localStorage.setItem('token',payload.data.token);
window.location.href="/amis/index.html";
}
return payload
},
}