MessageBox: add a tip to the doc (#11214)

examples/docs/en-US/message-box.md

@@ -287,6 +287,10 @@ Can be customized to show various content.
 ```
 :::
 
+:::tip
+The content of MessageBox can be `VNode`, allowing us to pass custom components. When opening the MessageBox, Vue compares new `VNode` with old `VNode`, then figures out how to efficiently update the UI, so the components may not be completely re-rendered ([#8931](https://github.com/ElemeFE/element/issues/8931)). In this case, you can add a unique key to `VNode` each time MessageBox opens: [example](https://jsfiddle.net/zhiyang/ezmhq2ef).
+:::
+
 ### Use HTML String
 `message` supports HTML string.
 

examples/docs/es/message-box.md

@@ -288,6 +288,10 @@ Puede ser personalizado para mostrar diversos contenidos.
 ```
 :::
 
+:::tip
+The content of MessageBox can be `VNode`, allowing us to pass custom components. When opening the MessageBox, Vue compares new `VNode` with old `VNode`, then figures out how to efficiently update the UI, so the components may not be completely re-rendered ([#8931](https://github.com/ElemeFE/element/issues/8931)). In this case, you can add a unique key to `VNode` each time MessageBox opens: [example](https://jsfiddle.net/zhiyang/ezmhq2ef).
+:::
+
 ### Utiliza cadenas HTML
 `message` soporta cadenas HTML.
 

examples/docs/zh-CN/message-box.md

@@ -285,6 +285,10 @@
 ```
 :::
 
+:::tip
+弹出层的内容可以是 `VNode`，所以我们能把一些自定义组件传入其中。每次弹出层打开后，Vue 会对新老 `VNode` 节点进行比对，然后将根据比较结果进行最小单位地修改视图。这也许会造成弹出层内容区域的组件没有重新渲染，例如 [#8931](https://github.com/ElemeFE/element/issues/8931)。当这类问题出现时，解决方案是给 `VNode` 加上一个不相同的 key，参考[这里](https://jsfiddle.net/zhiyang/ezmhq2ef/)。
+:::
+
 ### 使用 HTML 片段
 `message` 属性支持传入 HTML 片段