DocsICP FilingConsole
官方文档
首页

Tree control

更新时间：
复制 MD 格式
我的收藏

This component displays hierarchical data in a tree structure, such as folders, organizational charts, biological taxonomy, and countries or regions. It supports expanding, collapsing, and selecting nodes. This document shows you how to configure the component.

Example

Select an item from the tree.

树形

Step 1: Add the component

  1. Create a web application. For more information, see Create a web application.

  2. In the web application editor, click the component icon 组件 on the far left.

  3. Above the component list on the left of the canvas, enter tree control to find the component, then drag it to the canvas.

    For more information about adding components, see Add a component.

Step 2: Configure the data source

  1. In the style panel on the right, click data source and then click Configure Data Source.
  2. On the Configure Data Source page, select a data source type and complete the configuration.
    Available data types include API, static data, and application push.
  3. Click OK.

Step 3: Configure styles

  1. On the style tab on the right, configure the component's display settings.
    Parameter Description
    Tree control configuration Specifies whether to show lines and expand all nodes. Both are selected by default.
    Tree control style Sets the background color of the component.

  2. Adjust the component's position on the page. For more information about general component style settings, see Configure styles.

Step 4: Configure actions

  1. InteractionOn the tab, configure events and actions. For more information, see Interaction configuration.
    ClickThis component supports the event. When you select an item's label, the component's value becomes the corresponding value.

  2. Click Preview in the upper-right corner of the page to view and debug the component's data and style.

Previous：TimeNext：Steps