162 lines
4.9 KiB
Markdown
162 lines
4.9 KiB
Markdown
|
# 数据更新
|
|||
|
|
https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/mock2/service/form?tpl=tpl1
|
|||
|
|
返回
|
|||
|
|
```json
|
|||
|
|
{"status":0,"msg":"","data":{"data":{"dy_1":"还可以更新值"},"controls":[{"type":"text","label":"动态字段1","name":"dy_1","required":true},{"type":"text","label":"动态字段2","name":"dy_2"}]}}
|
|||
|
|
{"status":0,"msg":"","data":{"type":"panel","title":"不是非得是 controls","body":"也可以是其他渲染器"}}
|
|||
|
|
{"status":0,"msg":"","data":{"type":"tpl","tpl":"简单点好。"}}
|
|||
|
|
```
|
|||
|
|
部分代码
|
|||
|
|
```json
|
|||
|
|
{
|
|||
|
|
"title": "其他信息",
|
|||
|
|
"type": "fieldset",
|
|||
|
|
"body": [
|
|||
|
|
{
|
|||
|
|
"name": "tpl",
|
|||
|
|
"type": "select",
|
|||
|
|
"label": "模板",
|
|||
|
|
"inline": true,
|
|||
|
|
"required": true,
|
|||
|
|
"value": "tpl1",
|
|||
|
|
"options": [
|
|||
|
|
{
|
|||
|
|
"label": "模板1",
|
|||
|
|
"value": "tpl1"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label": "模板2",
|
|||
|
|
"value": "tpl2"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label": "模板3",
|
|||
|
|
"value": "tpl3"
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"type": "service",
|
|||
|
|
"className": "m-t",
|
|||
|
|
"initFetchSchemaOn": "data.tpl",
|
|||
|
|
"schemaApi": "https://3xsw4ap8wah59.cfc-execute.bj.baidubce.com/api/amis-mock/mock2/service/form?tpl=$tpl"
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
# 按钮联动
|
|||
|
|
## 显隐和使能
|
|||
|
|
一种方法是通过
|
|||
|
|
## 标签联动
|
|||
|
|
一种方法是使用变量+` "type": "button-toolbar",`，无效的按钮隐藏掉，有效的按钮显示
|
|||
|
|
|
|||
|
|
# 高亮
|
|||
|
|
|
|||
|
|
## 日志高亮
|
|||
|
|
|
|||
|
|
[参考]: https://schier.co/blog/how-to-re-run-prismjs-on-ajax-content
|
|||
|
|
|
|||
|
|
`prismjs`支持log格式日志高亮，
|
|||
|
|
|
|||
|
|
```log
|
|||
|
|
[Sun Mar 7 16:02:00 2021] [DEBUG] Apache/1.3.29 (Unix) configured -- resuming normal operations
|
|||
|
|
[Sun Mar 7 16:02:00 2021] [INFO] Server built: Feb 27 2021 13:56:37
|
|||
|
|
[Sun Mar 7 16:02:00 2021] [DEBUG] Accept mutex: sysvsem (Default: sysvsem)
|
|||
|
|
[Sun Mar 7 17:21:44 2021] [INFO] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection
|
|||
|
|
[Sun Mar 7 17:23:53 2021] [WARNING]: Use of uninitialized value in concatenation (.) or string at /home/httpd line 528.
|
|||
|
|
[Sun Mar 7 17:23:53 2021] [WARNING]: Can't create file /home/httpd/twiki/data/Main/WebStatistics.txt - Permission denied
|
|||
|
|
[Sun Mar 7 17:27:37 2021] [INFO] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection
|
|||
|
|
[Sun Mar 7 17:31:39 2021] [INFO] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection
|
|||
|
|
[Sun Mar 7 21:16:17 2021] [ERROR] [client xx.xx.xx.xx] File does not exist: /home/httpd/twiki/view/Main/WebHome",
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 动态刷新
|
|||
|
|
|
|||
|
|
对应api
|
|||
|
|
|
|||
|
|
```js
|
|||
|
|
// Rerun Prism syntax highlighting on the current page
|
|||
|
|
Prism.highlightAll();
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
或
|
|||
|
|
|
|||
|
|
```js
|
|||
|
|
// Say you have a code block like this
|
|||
|
|
/**
|
|||
|
|
<pre>
|
|||
|
|
<code id="some-code" class="language-javascript">
|
|||
|
|
// This is some random code
|
|||
|
|
var foo = "bar"
|
|||
|
|
</code>
|
|||
|
|
</pre>
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
// Be sure to select the inner <code> and not the <pre>
|
|||
|
|
|
|||
|
|
// Using plain Javascript
|
|||
|
|
var block = document.getElementById('some-code')
|
|||
|
|
Prism.highlightElement(block);
|
|||
|
|
|
|||
|
|
// Using JQuery
|
|||
|
|
Prism.highlightElement($('#some-code')[0]);
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
建议后者，所有新增内容统一采用固定id，直接更新最后一个id的内容，间接实现局部刷新
|
|||
|
|
|
|||
|
|
## 监控网页内容变化
|
|||
|
|
|
|||
|
|
[参考]:(https://blog.csdn.net/u013350495/article/details/90755115)
|
|||
|
|
|
|||
|
|
==不能直接监控节点变化，会陷入死循环==
|
|||
|
|
|
|||
|
|
```html
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>javascript监听DOM内容改变事件</title>
|
|||
|
|
<style type="text/css">
|
|||
|
|
#el-test{
|
|||
|
|
line-height: 100px;
|
|||
|
|
width: 200px;
|
|||
|
|
border: #e5e5e5 solid 1px;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div id="el-test">QQ 1846492969</div>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
// 选择将观察突变的节点
|
|||
|
|
var targetNode = document.getElementById('el-test');
|
|||
|
|
|
|||
|
|
// 观察者的选项(要观察哪些突变)
|
|||
|
|
var config = { attributes: true, childList: true, subtree: true };
|
|||
|
|
|
|||
|
|
// 当观察到突变时执行的回调函数
|
|||
|
|
var callback = function(mutationsList) {
|
|||
|
|
mutationsList.forEach(function(item,index){
|
|||
|
|
if (item.type == 'childList') {
|
|||
|
|
console.log('有节点发生改变，当前节点的内容是：');
|
|||
|
|
console.log(item.target.innerHTML);
|
|||
|
|
} else if (item.type == 'attributes') {
|
|||
|
|
console.log('修改了'+item.attributeName+'属性');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 创建一个链接到回调函数的观察者实例
|
|||
|
|
var observer = new MutationObserver(callback);
|
|||
|
|
|
|||
|
|
// 开始观察已配置突变的目标节点
|
|||
|
|
observer.observe(targetNode, config);
|
|||
|
|
|
|||
|
|
// 停止观察
|
|||
|
|
//observer.disconnect();
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
```
|
|||
|
|
|