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

feat(dropdownmenu): 新增DropdownMenu组件 #503

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from

Conversation

ming680
Copy link
Contributor

@ming680 ming680 commented Aug 28, 2024

🤔 这个 PR 的性质是?

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

🔗 相关 Issue

fix #392

💡 需求背景和解决方案

📝 更新日志

  • feat(DropdownMenu): 新增 DropdownMenu 组件

  • 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项⚠️

  • 文档已补充或无须补充
  • 代码演示已提供或无须提供
  • TypeScript 定义已补充或无须补充
  • Changelog 已提供或无须提供

Copy link
Contributor

失败

@anlyyao anlyyao requested a review from HaixingOoO September 19, 2024 08:50
keys,
} = useDefaultProps<DropdownItemProps>(props, dropdownItemDefaultProps);
const { classPrefix } = useConfig();
const itemClass = `${classPrefix}-dropdown-item`;
Copy link
Collaborator

Choose a reason for hiding this comment

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

改用 usePrefixClass()

import uniqueId from 'lodash/uniqueId';
import React, { FC, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
import { CaretDownSmallIcon, CaretUpSmallIcon } from 'tdesign-icons-react';
import { Button, Checkbox, Popup, Radio, RadioGroup } from 'tdesign-mobile-react';
Copy link
Collaborator

Choose a reason for hiding this comment

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

组件内部使用相对路径

@@ -0,0 +1,66 @@
import cx from 'classnames';
import React, { ComponentProps, FC, forwardRef, useImperativeHandle, useState } from 'react';
import { StyledProps } from 'tdesign-mobile-react/common';
Copy link
Collaborator

Choose a reason for hiding this comment

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

组件内部使用相对路径

useDefaultProps<DropdownMenuProps>(props, dropdownMenuDefaultProps);

const { classPrefix } = useConfig();
const name = `${classPrefix}-dropdown-menu`;
Copy link
Collaborator

Choose a reason for hiding this comment

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

usePrefixClass

@@ -0,0 +1,66 @@
import cx from 'classnames';
import React, { ComponentProps, FC, forwardRef, useImperativeHandle, useState } from 'react';
Copy link
Collaborator

Choose a reason for hiding this comment

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

import type { FC } from "react"
类型建议这样引入


{{ customized }}


Copy link
Collaborator

Choose a reason for hiding this comment

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

以上内容应该存放在 tdeisgn-common 子仓库


{{ customized }}


Copy link
Collaborator

Choose a reason for hiding this comment

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

同中文文档

import _DropdownMenu from './DropdownMenu';

import './style';

Copy link
Collaborator

Choose a reason for hiding this comment

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

从./DropdownMenu, ./DropdownItem 模块中导出DropdownMenuProps 和DropdownItemProps 这两个类型定义

[keys, inputOptions],
);

const [id] = useState(uniqueId());
Copy link
Collaborator

@HaixingOoO HaixingOoO Sep 20, 2024

Choose a reason for hiding this comment

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

用ref

const idRef = useRef(null)
if(!idRef.current){
idRef.current = uniqueId()
}

: {}
}
>
{props.children ? (
Copy link
Collaborator

Choose a reason for hiding this comment

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

直接使用children就好,props.这个可以去掉,统一使用解构的值

)}
</div>

{footer ? footer : null}
Copy link
Collaborator

Choose a reason for hiding this comment

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

TNode类型的使用parseTNode来渲染

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.

【DropdownMenu新组件】任务单
3 participants