Column Pinning Example

This example demonstrates how to pin columns to the left or right of a table, ensuring that essential data remains visible during horizontal scrolling.

Overview

In this example, you will learn how to:

• Define columns with the pinned property
• Fix columns to the left or right
• Monitor table state changes with pinned columns

Example

Key Concepts

• Pinned Columns: Use the pinned attribute ("left" or "right") to fix a column.
• State Monitoring: The onStateChange callback allows you to track how pinned columns affect table state.

Customization Tips

• Adjust column widths via the width property for improved layout.
• Combine column pinning with other features like column resizing for a dynamic interface.

Next Steps

• Check out the Column Visibility Example to learn how to toggle columns.
• Explore Toggle Column Pinning for interactive pinning options.