属性

属性面板虽然会因为当前选中的组件的不同而具有不同的配置选项,但有些是共通的。

类名:自行起个类名,然后在样式面板选中此类名进行可视化设计,或者CSS面板中用此类名作为选择器编写样式。多个类名用空格隔开,可以用表达式生成动态类名。选用平台提供的预设类名可以快速完成设计。

渲染条件:通常用某个变量的值来动态决定是否要渲染此组件(及其子组件),如果仅仅是暂时不需要此组件直接输入0/false即可。

数据源:先选择数据类型再填入数据或表达式,详见数据源

子组件:添加其它组件或直接输入静态文本或动态表达式作为子组件,可以删除现有子组件或拖拽排序。

事件:打开事件开关后就可以添加多种不同类型的事件,点击小三角形可以模拟执行。

局部表达式/对象/代码:只能给当前组件的表达式使用(事件/动态类名/渲染条件/动态文本子组件等)。如果想提供给其它组件使用,应先在事件中把它们的值赋给页面变量或全局变量。

上下文数据:是数据源在当前组件的投射,可以清晰的看到有哪些局部数据可以使用(永远可以使用的未列出,如$v/$V/$c/$ev/$el等)。右键画布里用动态数组渲染出来的某个子组件比直接从组件树中选的会显示更明确的数据(当前数据项$x和索引$i)。

表达式助手/执行环境Ctrl+单击任一可以输入表达式的地方或聚焦后Ctrl+Enter会弹出表达式助手,内容与点击位置相关,其中$ctx就是上下文数据,但还有更多详尽的数据。Tab选择下一个表达式,Enter或点击会把当前表达式填入框中。点击右侧的加号可以唤起搭建向导,使用当前变量生成表格/详情。

右键全屏编辑:右键任一可以输入表达式的地方会弹出全屏编辑器,Ctrl+S保存并退出全屏,Esc不保存直接退出全屏。

根节点(root)

标题:显示在浏览器标签上,在搜索引擎SEO占有很高权重。比如当前这个页面使用的是这篇文章的标题作为页面标题。

数据源:跟其它组件的数据源不同,它的数据直接来自数据库,由地址栏中的$id或别名指定哪条数据,直接作用于整个页面,动态页面标题的数据就来自这里。

需要登录:只有已登录用户才能访问此页面,此时有$c.me变量,可以在初始化事件中对不符合条件的用户做进一步处理(如提示无权限并跳转到首页),也可以把me设定为页面数据源。

右键事件冒泡:开发模式下右键事件被用来快速选择一个叶子组件而不往上冒泡传播,这导致父组件无法捕获子组件触发的右键事件(自身的右键事件还是可以的),打开这个开关就可以正常捕获了(99.9%的应用都无需打开它)。

导入HTML:在其它网站遇到合适的页面片段时可以打开开发者工具(F12)把对应的HTML复制粘贴进来,通常还需要把相关的CSS也粘贴到页面CSS里来才能长得跟原来的一样。这就相当于把其它网站都当成是模板,导进来后适当改造(简化/动态化),加快开发速度。

清空页面:清空页面内容重新开始。在源码面板删除所有内容效果也一样。

由众触低代码平台生成和驱动