From e0cf55e875eec61691415d84747e2ce2da47d847 Mon Sep 17 00:00:00 2001 From: HIsheR Date: Mon, 26 Oct 2026 19:22:56 +0800 Subject: [PATCH] =?UTF-8?q?iter(g209):=20=E6=BC=94=E7=A4=BA=E9=A1=B5?= =?UTF-8?q?=E8=A1=A5=E9=BD=90=E6=96=B0=E5=8F=82=E6=95=B0=E7=8E=B0=E5=9C=BA?= =?UTF-8?q?=E6=BC=94=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/demo/main.ts | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/apps/demo/main.ts b/apps/demo/main.ts index 5a73ed9..2e5107c 100644 --- a/apps/demo/main.ts +++ b/apps/demo/main.ts @@ -210,6 +210,7 @@ const priceHi = signal(800); // 区间滑块上限 // —— 数字输入:购买数量演示,与禁用态实例共用同一信号 —— const qty = signal(1); const price = signal('9.9'); // 演示 suffix 附加块 +const pwd = signal(''); // 演示 password 显隐切换 const amount = signal(2); // 演示 inputNumber 前后缀 // —— 步骤条:下单流程演示,按钮推进、点已完成步骤回跳 —— @@ -217,6 +218,7 @@ const stepIdx = signal(0); // —— 评分:满意度演示,与只读实例共用同一信号 —— const score = signal(0); +const score2 = signal(3); // 演示 allowClear 可清除评分 // —— 空状态:搜索无结果演示 —— const noResult = signal(true); @@ -315,10 +317,11 @@ const content = h( section( 'sec-bind', '双向绑定', - 'textField 与信号双向同步:输入即回显;prefix/suffix 渲染为输入框内侧附加块;clearable 开启后有值即显一键清空。', + 'textField 与信号双向同步:输入即回显;prefix/suffix 渲染为输入框内侧附加块;clearable 开启后有值即显一键清空;password 原生打点并内置显隐切换。', textField({ placeholder: '输入名字…', value: name }), textField({ placeholder: '搜索…', value: name, prefix: searchIcon(), clearable: true }), textField({ value: price, suffix: '元', clearable: true }), + textField({ placeholder: '密码…', value: pwd, password: true, clearable: true }), h('span', { class: 'out' }, () => (name() ? `你好,${name()}!` : '等待输入…')), ), section( @@ -343,6 +346,7 @@ const content = h( }), h('span', { class: 'out' }, () => (stackPick() ? `技术栈:${stackPick()}` : '分组下拉:试试搜索「d」'))), h('div', { class: 'row' }, radioGroup({ options: [{ value: 's', label: '小' }, { value: 'm', label: '中' }, { value: 'l', label: '大' }], value: size })), textarea({ placeholder: '一句话介绍…', value: bio, rows: 2, maxCount: 30 }), + textarea({ placeholder: '自适应高度(1-4 行钳制)…', value: signal(''), autosize: { minRows: 1, maxRows: 4 } }), h('span', { class: 'out' }, () => `简介 ${bio().length} 字`), h( 'div', @@ -632,13 +636,14 @@ const content = h( section( 'sec-rate', '评分', - 'rate:点选星标打分,悬停预览移出还原,键盘 →/↑ 加分 ←/↓ 减分,disabled 只读展示。', + 'rate:点选星标打分,悬停预览移出还原,键盘 →/↑ 加分 ←/↓ 减分,disabled 只读展示,allowClear 再点当前分清零。', h( 'div', { class: 'row' }, rate({ value: score, onChange: (v) => toast.info(`评分 ${v} 星`) }), h('span', { class: 'out' }, () => `当前:${score() || '未评分'}`), ), + h('div', { class: 'row' }, rate({ value: score2, allowClear: true }), h('span', { class: 'out' }, () => `可清除(再点当前分归零):${score2() || '已清'}`)), h('div', { class: 'row' }, rate({ value: score, disabled: true })), ), section( @@ -946,13 +951,14 @@ const content = h( section( 'sec-multiselect', '多选下拉', - 'multiSelect:标签式回显 + 可搜索弹层,点选不收起弹层(连续多选),空输入退格删末个标签,max 到限后未选项禁用,maxTagCount 折叠溢出标签。', + 'multiSelect:标签式回显 + 可搜索弹层,点选不收起弹层(连续多选),空输入退格删末个标签,max 到限后未选项禁用,maxTagCount 折叠溢出标签,clearable 一键清空。', h( 'div', { class: 'row' }, multiSelect({ value: tagPick, max: 3, + clearable: true, placeholder: '选择技术栈(最多 3 项)', onChange: (v) => toast.info(`已选 ${v.length} 项`), options: [