Merge branch 'main' of https://github.com/hellof2e/quarkd-docs-react

hellof2e · Dec 23, 2024 · 86884aa · 86884aa
2 parents ab209f4 + a39c763
commit 86884aa
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 9 deletions.
diff --git a/src/docs_react/config.json b/src/docs_react/config.json
@@ -1,5 +1,5 @@
 {
-  "version": "2.0.4",
+  "version": "2.0.5",
   "nav": [
     {
       "name": "基础组件",

diff --git a/src/docs_react/docs/popup/doc-react.en-US.md b/src/docs_react/docs/popup/doc-react.en-US.md
@@ -40,31 +40,52 @@ export default () => {
 Use position prop to set popup display position.By default, the popup is centered and can be set to top, bottom, left, right.
 
 ```html
-<Popup position="top" :open="open" />
+<Popup position="top" open="{open}" />
 ```
 
 ### Close Icon
 
 After setting the closeable property, the close icon will be displayed in the upper right corner of the popup layer.
 
 ```html
-<Popup position="bottom" :open="open" closeable />
+<Popup position="bottom" open="{open}" closeable />
 ```
 
 ### Forbid mask click
 
 forbid mask click
 
 ```html
-<Popup position="bottom" :open="open" forbidmaskclick />
+<Popup position="bottom" open="{open}" forbidmaskclick />
 ```
 
 ### Round Corner
 
 After setting the round property, the popup window will add different rounded corner styles according to the popup position.
 
 ```html
-<Popup position="bottom" :open="open" round />
+<Popup position="bottom" open="{open}" round />
+```
+
+### 内部滚动设置
+
+You can specify the element that needs to scroll by setting the `scrollid`.
+
+```jsx
+<quark-popup
+  position="center"
+  open={open}
+  onClose={handleClose}
+  scrollid="scroll-it" // Set the id of the element that needs to scroll
+>
+  <div class="fix-content">Fixable content</div>
+  {/* The following elements can scroll */}
+  <div id="scroll-it" class="scroll-list">
+    {new Array(100).fill(1).map((item) => (
+      <div>{{ item }}</div>
+    ))}
+  </div>
+</quark-popup>
 ```
 
 ## API

diff --git a/src/docs_react/docs/popup/doc-react.zh-CN.md b/src/docs_react/docs/popup/doc-react.zh-CN.md
@@ -39,31 +39,52 @@ export default () => {
 通过 position 属性设置弹出位置，默认居中弹出，可以设置为 top、bottom、left、right。
 
 ```html
-<Popup position="top" :open="open" />
+<Popup position="top" open="{open}" />
 ```
 
 ### 关闭图标
 
 设置 closeable 属性后，会在弹出层的右上角显示关闭图标。
 
 ```html
-<Popup position="bottom" :open="open" closeable />
+<Popup position="bottom" open="{open}" closeable />
 ```
 
 ### 禁止遮罩层点击
 
 设置 forbidmaskclick 属性后，点击遮罩层将无法自动关闭弹层。
 
 ```html
-<Popup position="bottom" :open="open" forbidmaskclick />
+<Popup position="bottom" open="{open}" forbidmaskclick />
 ```
 
 ### 圆角弹窗
 
 设置 round 属性后，弹窗会根据弹出位置添加不同的圆角样式。
 
 ```html
-<Popup position="bottom" :open="open" round />
+<Popup position="bottom" open="{open}" round />
+```
+
+### 内部滚动设置
+
+通过 `scrollid` 设置指定需要滚动的元素即可。
+
+```jsx
+<quark-popup
+  position="center"
+  open={open}
+  onClose={handleClose}
+  scrollid="scroll-it" // 设置需要滚动元素的id
+>
+  <div class="fix-content">Fixable content</div>
+  {/* 以下元素可实现滚动 */}
+  <div id="scroll-it" class="scroll-list">
+    {new Array(100).fill(1).map((item) => (
+      <div>{{ item }}</div>
+    ))}
+  </div>
+</quark-popup>
 ```
 
 ## API