Skip to content

feat: add form component#3912

Merged
jin0209 merged 15 commits intoTencent:developfrom
Jay2138:form
Sep 10, 2025
Merged

feat: add form component#3912
jin0209 merged 15 commits intoTencent:developfrom
Jay2138:form

Conversation

@Jay2138
Copy link
Copy Markdown
Contributor

@Jay2138 Jay2138 commented Sep 8, 2025

🤔 这个 PR 的性质是?

  • 日常 bug 修复
  • 新特性提交
  • 文档改进
  • 演示代码改进
  • 组件样式/交互改进
  • CI/CD 改进
  • 重构
  • 代码风格优化
  • 测试用例
  • 分支合并
  • 其他

🔗 相关 Issue

#3726

@Jay2138 Jay2138 changed the title 新增表单组件 feat: add form component Sep 8, 2025
Comment thread example/components/pull-down-list/index.wxml Outdated
Comment thread example/components/pull-down-list/index.ts Outdated
Comment thread example/pages/home/data/form.ts
Comment thread example/pages/home/data/form.ts Outdated
Comment thread packages/components/form-item/README.en-US.md Outdated
Comment thread packages/components/form-item/form-item.ts Outdated
Comment thread packages/components/form/README.en-US.md
Comment thread packages/components/form/form.ts Outdated
Comment thread packages/components/form/form.ts
Comment thread packages/components/package.json Outdated
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Sep 9, 2025

Open in StackBlitz

npm i https://pkg.pr.new/tdesign-miniprogram@3912

commit: b4a2c02

@jin0209 jin0209 merged commit e2f171c into Tencent:develop Sep 10, 2025
7 checks passed
Comment thread script/gulpfile.base.js

// options
const ignore = ['**/__test__/**', '**/_example/**', '**/node_modules/**'];
const ignore = ['**/__test__', '**/__test__/**', '**/_example/**', '**/packages/common/**', '**/node_modules/**'];
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

**/__test__/** 已经包含了 **/__test__

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

打包不涉及common子仓库,**/packages/common/** 写进去没有实际意义,可移除

@form-prefix: ~'@{prefix}-form';

// Form 变量定义
@form-bg-color: var(--td-form-bg-color, #ffffff);
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

可以直接用 @bg-color-container

@form-bg-color: var(--td-form-bg-color, #ffffff);
@form-padding: var(--td-form-padding, 0);
@form-border-radius: var(--td-form-border-radius, 0);
@form-disabled-opacity: var(--td-form-disabled-opacity, 0.6);
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

现在只有 color、size、border 对外提供 css vars,opacity 暂不提供

}

// 紧凑模式
&--compact {
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

紧凑和宽松样式 似乎没有被实际应用

Copy link
Copy Markdown
Contributor Author

@Jay2138 Jay2138 Sep 11, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

后续迭代添加,先添加对应样式

@@ -0,0 +1,5 @@
<form
class="{{classPrefix}} {{classPrefix}}--{{labelAlign}} {{classPrefix}}--{{disabled ? 'disabled' : ''}} {{classPrefix}}--{{readonly ? 'readonly' : ''}} {{prefix}}-class"
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

组件统一支持了, style 属性和外部样式类 class。组件根节点上需要相应补齐

const { prefix } = config;
const name = `${prefix}-form`;

Component({
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TD 重新封装了 wxComponent 装饰器和 SuperComponent 基类,统一处理了组件通用属性和特性。

@wxComponent()
export default class Form extends SuperComponent {
  // 组件逻辑
}

clickHandle(e) {
let { name, path = '' } = e.detail.item as {
// 添加安全检查,确保e.detail存在
if (!e.detail) {
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

e.detail 一定会存在吧 🤔

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants