Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

表单内输入框样式规范不一致 #1493

Closed
loganylwu opened this issue Jul 2, 2023 · 4 comments
Closed

表单内输入框样式规范不一致 #1493

loganylwu opened this issue Jul 2, 2023 · 4 comments
Assignees
Labels
question Further information is requested

Comments

@loganylwu
Copy link

loganylwu commented Jul 2, 2023

TDesign-vue-next 1.3.9版本中,为什么 input-number 要定死一个固定width,而input却定义的是width:100%?

这样不一致的行为

  1. 行为不一致,让人觉得组件无法统一很疑惑,
  2. 带来了额外的CSS处理负担,因为表单样式宽度不一了
image

示例Demo如下

<t-form>
    <t-form-item label="贷款金额" name="amount">
      <t-input-adornment append="">
        <t-input-number large-number theme="normal" :format="formatLargeNumber" placeholder="请输入内容"/>
      </t-input-adornment>
    </t-form-item>
    <t-form-item label="贷款年限" name="loanTerm">
      <t-input-adornment append="">
        <t-input placeholder="请输入内容"/>
      </t-input-adornment>
    </t-form-item>
    <t-form-item label="贷款年利率" name="loanRate">
      <t-input-adornment append="%">
        <t-input placeholder="请输入内容"/>
      </t-input-adornment>
    </t-form-item>
    <t-form-item label="还款方式" name="rePaymentMethod">
      <t-radio-group default-value="equalPrincipal">
        <t-radio value="equalPrincipal">等额本金</t-radio>
        <t-radio value="equalInstallment">等额本息</t-radio>
      </t-radio-group>
    </t-form-item>
  </t-form>
@github-actions
Copy link

github-actions bot commented Jul 2, 2023

👋 @loganylwu,感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。

@github-actions
Copy link

github-actions bot commented Jul 2, 2023

♥️ 有劳 @xiaosansiji 尽快确认问题。
确认有效后将下一步计划和可能需要的时间回复给 @loganylwu

@xiaosansiji xiaosansiji added the question Further information is requested label Jul 6, 2023
@chaishi
Copy link
Collaborator

chaishi commented Jul 6, 2023

这是个好问题,可能最初只是为了限制一个 min-width

@loganylwu
Copy link
Author

这是个好问题,可能最初只是为了限制一个 min-width

嗯.... 看来要追溯历史确实是个麻烦事,那就不深究了

建议input-number组件能够遵循和 input组件一样的宽度选项

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

3 participants