Rendering Errors with Custom Components and app.use(Component) in Vite Projects

[revolist]

Description:
We’ve encountered a rendering issue with custom components when using the app.use(Component) approach in Vite-based projects. This problem is linked to updates made in #512.

Details:

• Problem: The issue manifests when the key (${p.prop}-${p.rowIndex}) is used in custom components. Errors occur particularly when the source data is passed from outside and modified externally.
• Affected Version: The issue appears to be related to the changes introduced in VueTemplate render repeat  #512.
• Sandbox Example: Sandbox with Issue
• Manual Import Solution: Switching to manual import as recommended here resolves the problem.

Current Status:

• Regular component import works as a workaround.
• Further investigation is ongoing regarding the app.use(Component) approach and its interaction with Vite.
• The key (${p.prop}-${p.rowIndex}) remains essential for performance optimization and reducing redraws.

Action Items:

1. Investigate: Continue to analyze the issue related to app.use(Component) and Vite, especially in light of VueTemplate render repeat  #512.
2. Review: Consider manual component import as a fix.

Links:

• Discussion
• Element Plus Manual Import
• Issue #512

Additional Notes:

• Please review the sandbox example and manual import approach for potential solutions.
• Update or provide further information as needed.

https://codesandbox.io/p/github/revolist/vue3-app-use-component--513/main?workspaceId=b937c3e5-f7f0-45a6-aa08-b9f120dcd9b0