This commit is contained in:
RickCole21 2020-08-06 15:18:45 +08:00
parent c64d00827b
commit 14031970c4
5 changed files with 361 additions and 366 deletions

View File

@ -1,19 +1,20 @@
--- ---
title: 表达式 title: 表达式
description: description:
type: 0 type: 0
group: 💡 概念 group: 💡 概念
menuName: 表达式 menuName: 表达式
icon: icon:
order: 13 order: 13
--- ---
一般来说,属性名类似于`xxxOn`的配置项,都可以使用表达式进行配置,表达式具有如下的语法: 一般来说,属性名类似于`xxxOn`的配置项,都可以使用表达式进行配置,表达式具有如下的语法:
```json ```json
{ {
"type": "tpl", "type": "tpl",
"tpl": "当前作用域中变量 show 是 1 的时候才可以看得到我哦~", "tpl": "当前作用域中变量 show 是 1 的时候才可以看得到我哦~",
"visibleOn": "data.show === 1" "visibleOn": "data.show === 1"
} }
``` ```
@ -25,15 +26,10 @@ order: 13
在 amis 的实现过程中,当正则匹配到某个组件存在`xxxOn`语法的属性名时,会尝试进行下面步骤(以上面配置为例): 在 amis 的实现过程中,当正则匹配到某个组件存在`xxxOn`语法的属性名时,会尝试进行下面步骤(以上面配置为例):
1. 提取`visibleOn`配置项配置的 JavaScript 语句`data.show === 1`并以当前组件的数据域为这段代码的数据作用域执行这段js代码 1. 提取`visibleOn`配置项配置的 JavaScript 语句`data.show === 1`,并以当前组件的数据域为这段代码的数据作用域,执行这段 js 代码;
2. 之后将执行结果赋值给`visible`并添加到组件属性中 2. 之后将执行结果赋值给`visible`并添加到组件属性中
3. 执行渲染。当前示例中:`visible`代表着是否显示当前组件; 3. 执行渲染。当前示例中:`visible`代表着是否显示当前组件;
组件不同的配置项会有不同的效果,请大家在组件文档中多留意。 组件不同的配置项会有不同的效果,请大家在组件文档中多留意。
> 表达式的执行结果预期应该是`boolean`类型值如果不是amis 会根据 JavaScript 的规则将结果视作`boolean`类型进行判断 > 表达式的执行结果预期应该是`boolean`类型值如果不是amis 会根据 JavaScript 的规则将结果视作`boolean`类型进行判断

View File

@ -652,9 +652,9 @@ export const docs = [
}, },
{ {
label: 'ButtonGroup 按钮组', label: 'ButtonGroup 按钮组',
path: '/docs/components/buttongroup', path: '/docs/components/button-group',
getComponent: (location, cb) => getComponent: (location, cb) =>
require(['../../docs/components/buttongroup.md'], doc => { require(['../../docs/components/button-group.md'], doc => {
cb(null, makeMarkdownRenderer(doc)); cb(null, makeMarkdownRenderer(doc));
}) })
}, },

View File

@ -251,7 +251,7 @@ export default function (doc) {
</div> </div>
</div> </div>
</div> </div>
{doc.toc && doc.toc.children && doc.toc.children.length > 1 ? ( {doc.toc && doc.toc.children && doc.toc.children.length > 0 ? (
<div className="Doc-toc hidden-xs hidden-sm"> <div className="Doc-toc hidden-xs hidden-sm">
<div> <div>
<div className="Doc-headingList"> <div className="Doc-headingList">

File diff suppressed because it is too large Load Diff

View File

@ -448,10 +448,6 @@ a {
> pre { > pre {
margin-bottom: 30px; margin-bottom: 30px;
} }
table:not(.table) {
word-break: break-word;
}
} }
} }