Update docs

yued-fe · Jun 8, 2023 · a0fd608 · a0fd608
1 parent efaccba
commit a0fd608
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 7 deletions.
diff --git a/edge/about.design.html b/edge/about.design.html
@@ -67,7 +67,7 @@ <h4>面向设计开发</h4>
             <p>所以，LuLu UI是没有版本的概念的，只有一条核心线自己往前走。当新项目过来需要使用的时候，完全拷贝LuLu UI到项目开发目录中，然后根据当前项目的设计风格，对HTML和JS进行结构上的调整，是放心大胆的调整。</p>
             <p>因此，LuLu UI组件不是传统的大而全，而是走极简轻便灵活方向，表现为模块低耦合，层级扁平；API非常少，尤其一些基本组件，直接就没有API。</p>
             <p>LuLu UI没有版本概念，只有主题，目前有morden、peak, pure和edge四个主题，寓意为“现代”、“巅峰”、“纯粹”和“边缘”。</p>
-            <p>本文档对应的是edge版本，不兼容IE浏览器，Safari浏览器需要引入<a href="https://unpkg.com/lu2/theme/edge/js/common/all.js">safari-polyfill</a>。</p>
+            <p>本文档对应的是edge版本，不兼容IE浏览器，Safari浏览器需要引入<a href="https://unpkg.com/lu2/theme/edge/js/common/safari-polyfill.js">safari-polyfill</a>。</p>
             <h4>基于HTML开发</h4>
             <p>相对于其他UI框架，LuLu UI技术栈更偏向HTML和CSS，以便更友好地还原设计和增强体验。</p>
             <p>具体而言，LuLu UI基于HTML开发，实现前端开发分离，具体可参考“<a href="https://www.zhangxinxu.com/wordpress/?p=5180">顺势而为，HTML发展与UI组件设计进化</a>”。</p>

diff --git a/edge/apis.datalist.html b/edge/apis.datalist.html
@@ -338,10 +338,10 @@ <h5>其他说明</h5>
 
             <h4>2. Ajax autocomplate功能</h4>
             <form action="https://www.qidian.com/search" target="_qidian">
-                <input class="ui-input mr10" type="search" id="s2" name="kw" is="ui-datalist" size="30" placeholder="输入字母"><button type="submit" class="ui-button" data-type="primary">搜索</button>
+                <input class="ui-input mr10" type="search" id="s2" is="ui-datalist" size="30" placeholder="输入字母"><button type="submit" class="ui-button" data-type="primary">搜索</button>
             </form>
             <pre>&lt;form&gt;
-    &lt;input class="ui-input" type="search" id="s2" name="kw" placeholder="输入字母"&gt;
+    &lt;input class="ui-input" type="search" id="s2" is="ui-datalist" placeholder="输入字母"&gt;
     &lt;button type="submit" class="ui-button" data-type="primary"&gt;搜索&lt;/button&gt;
 &lt;/form&gt;</pre>
             <pre><span class="green">// 列表内容不转义，支持HTML显示</span>
@@ -350,8 +350,9 @@ <h4>2. Ajax autocomplate功能</h4>
 s2.params.data = {
     url: '/search',
     data: {
-        userid: 1
+        userid: 1,
     },
+    name: 'kw',
     success() {
         console.log('success callback successed!');
     }
@@ -368,7 +369,9 @@ <h5>参数</h5>
                 <dt>url</dt>
                 <dd>字符串。必需。请求后端数据的地址。注意，IE9浏览器不支持跨域的URL地址。</dd>
                 <dt>data</dt>
-                <dd>纯对象。可选。请求后端数据时发送的数据。其中输入框数据发送是组件内置的，默认使用<code>&lt;input&gt;</code>元素的<code>name</code>属性值作为字段发送数据，如果缺省，使用字符<code>k</code>代替。</dd>
+                <dd>纯对象。可选。请求后端数据时发送的数据。其中输入框数据发送是组件内置的，无需额外设置。</dd>
+                <dt>name</dt>
+                <dd>字符串。可选。搜索内容对应的字段名称，如果不设置，使用<code>&lt;input&gt;</code>元素的<code>name</code>属性值，如果<code>name</code>属性值也没设置，使用字符<code>k</code>代替。</dd>
                 <dt>success</dt>
                 <dd>函数。可选。成功回调，支持一个参数，为后端返回的JSON数据。</dd>
                 <dt>error</dt>
@@ -883,6 +886,7 @@ <h4>带搜索的下拉列表</h4>
         data: {
             userid: 1
         },
+        name: 'kw',
         success() {
             console.log('success callback successed!');
         }

diff --git a/edge/apis.dialog.html b/edge/apis.dialog.html
@@ -196,10 +196,22 @@ <h3>弹框内容设置</h3>
 
             <h4>1. 直接显示</h4>
             <p>需要显示的内容内容直接放在<code>&lt;dialog&gt;</code>元素中，例如：</p>
-            <pre>&lt;dialog id="dialog2" is="ui-dialog" title="我是标题"&gt;Hello, LuLu UI!&lt;/dialog&gt;</pre>
+            <pre>&lt;dialog id="dialog2" is="ui-dialog" title="我是标题"&gt;
+    &lt;select is="ui-select" style="width: 150px"&gt;
+        &lt;option value="1"&gt;选项1&lt;/option&gt;
+        &lt;option value="2"&gt;选项2&lt;/option&gt;
+        &lt;option value="3"&gt;选项3&lt;/option&gt;
+    &lt;/select&gt;            
+&lt;/dialog&gt;</pre>
             <p>此时弹框直接显示已有内容，例如：</p>
             <pre>dialog2.show();</pre>
-            <dialog id="dialog2" is="ui-dialog" title="我是标题">Hello, LuLu UI!</dialog>
+            <dialog id="dialog2" is="ui-dialog" title="我是标题">
+                <select is="ui-select" style="width: 150px">
+                    <option value="1">选项1</option>
+                    <option value="2">选项2</option>
+                    <option value="3">选项3</option>
+                </select>
+            </dialog>
             <p>测试：<button class="ui-button" data-type="primary" onclick="dialog2.show();">点击显示内置内容的弹框</button></p>
             <p>其中，<code>&lt;dialog&gt;</code>元素上的<code>title</code>属性值会作为弹框的标题显示。此<code>title</code>属性是一次性的，也就是后期再使用<code>dialog.title</code>修改<code>title</code>属性是无效的，请使用<code>dialog.params.title</code>进行标题的修改。</p>