iter(g03): 输入组件补 prefix/suffix 附加块
This commit is contained in:
+6
-1
@@ -127,6 +127,8 @@ const volume = signal(40);
|
||||
|
||||
// —— 数字输入:购买数量演示,与禁用态实例共用同一信号 ——
|
||||
const qty = signal(1);
|
||||
const price = signal('9.9'); // 演示 suffix 附加块
|
||||
const amount = signal(2); // 演示 inputNumber 前后缀
|
||||
|
||||
// —— 步骤条:下单流程演示,按钮推进、点已完成步骤回跳 ——
|
||||
const stepIdx = signal(0);
|
||||
@@ -169,8 +171,10 @@ const content = h(
|
||||
section(
|
||||
'sec-bind',
|
||||
'双向绑定',
|
||||
'textField 与信号双向同步:输入即回显。',
|
||||
'textField 与信号双向同步:输入即回显;prefix/suffix 渲染为输入框内侧附加块。',
|
||||
textField({ placeholder: '输入名字…', value: name }),
|
||||
textField({ placeholder: '搜索…', value: name, prefix: '🔍' }),
|
||||
textField({ value: price, suffix: '元' }),
|
||||
h('span', { class: 'out' }, () => (name() ? `你好,${name()}!` : '等待输入…')),
|
||||
),
|
||||
section(
|
||||
@@ -267,6 +271,7 @@ const content = h(
|
||||
{ class: 'row' },
|
||||
inputNumber({ value: qty, min: 1, max: 99, onChange: (v) => toast.info(`数量 ${v}`) }),
|
||||
inputNumber({ value: qty, disabled: locked }),
|
||||
inputNumber({ value: amount, min: 0, prefix: '¥', suffix: '件' }),
|
||||
),
|
||||
),
|
||||
section(
|
||||
|
||||
Reference in New Issue
Block a user