百度amis平台经验分享（2）

1. amis里面的脚本如何调试？ 可以在script里面加入debugger语句。

"actionType": "custom" ，script里面加入debugger;语句，可以在控制台查看context和event的信息

"onEvent": {
			 "confirm": {
				 "actions": [
					         {
								 "actionType": "custom",
								 "script":
									  "debugger;" +
									  "var form1 = event.context.scoped.getComponentById('formadd').getData();" +
												"event.context.scoped.getComponentById('formtable').getData().formadd=form1;"+
												"event.context.scoped.getComponentById('formtable').submit();"
										}
									]
								}
							}

2. 会使用amisScoped.getComponentById('xx')，amisScoped.getComponentByName('xx')获取实例的值。 以上用在多表单提交上比较有用（多个form合并提交）

也可以使用event.context.scoped.getComponentById("xxx");

3. onClick: (e, props) => {}的使用。

{
									"label": "提交表单",
									"actionType": "confirm",
									"primary": true,
									"type": "button",
									onClick: (e, props) => {
										console.log('消息通知',e,props);
										//console.log("${__rendererData|json}")
										//props.formStore.setValues({name: 'amis'});
									}
								}

 

 

4. amsi的组件会转成react，特别是body，其实就是组件的内容，或者说body里面的内容就是组件的子组件

5. type:tpl ,tpl:`这里可以写类似于JSP一样的脚本`

        { 'type': 'tpl',  'name': 'fileIds', 'label': '培训计划附件'  , "tpl": `
          <%
            console.log(data.fileIds); 
            if (data.fileIds) { 
            var urlArray = data.fileIds.split(',');
            for (var i = 0; i < urlArray.length; i++) { %>
              <a href="<%= urlArray[i] %>" target="_blank"><%= urlArray[i].split('/').pop() %></a><br/>
            <% }
          } %>
          `},

 

 

6. data属性很重要，在很多地方都能用到，例如上面的这个例子 5，就用到了data里面的数据。

7. 总体结构要清楚，type,body这样的无限递归，

8. 官方文档也不是所有都有，还需要GPT来协助加上搜索引擎，还有自己的debug经验，不是所有答案都能网上找到现成的，需要自己去挖掘。

9. 如果请求的数据不符合要求，可以修改，同理，接收的数据不符合要求，也可以修改。可以看看官方文档。 

"requestAdaptor": function (data, ctx) {
	console.log("-------------",data,ctx);
	//不需要返回,直接改data就可以
}
"adaptor": function (payload, response) {
	console.log("-------------",payload,response);
	 return payload;
}

"requestAdaptor": function (data, ctx) {
							// 这里打印出原始的 data 结构，不需要return
							console.log("原始 data 数据:",data);
						}

"adaptor": function (payload, response) {
					 //需要返回，这里是对结果的拦截，可以修改结果
					return payload;
	 }