Implementing the Badge Count Scenario

Badge counts are relatively common in business scenarios, such as message notifications and logistics reminders. This document mainly introduces how to implement the badge count functionality using basic components in WeDa.

Implementation Steps

1. To quickly build scenarios, use the "Icon Navigation" block in WeDa.

2. For the first-level General Container component under the "Loop Display" node in the left outline tree, set its positioning to "relative".

3. Add a "General Container" component as the badge count container inside the "Loop Display" component. The general container requires setting the width and height, border, border-radius, positioning, and margin styles, as shown in the figure below.

4. Under the "General Container" for the badge count added in the previous step, add a "Text" component and enter the badge count value in the text content, using "1" as an example.

5. You can see the preview effect of the badge count.