跳到内容
新问题

对这个项目有疑问吗？注册一个免费的GitHub帐户以打开一个问题，并联系其维护者和社区。

注册GitHub

点击“注册GitHub”，即表示您同意我们的服务条款和隐私声明。我们偶尔会向您发送与帐户相关的电子邮件。

已经在GitHub上了？登录到您的帐户
跳到底部

重构下拉菜单以使用功能组件 #23142

已合并
将1个提交合并到从 2020年6月24日
已合并

重构下拉菜单以使用功能组件 #23142

将1个提交合并到从 2020年6月24日

对话

sc81标准
复制链接
贡献者

  • 重构测试

  • 重构DropdownMenu测试以消除奇怪的错误

  • 为onToggle和onClose属性添加文档

说明

这是如何测试的？

屏幕截图

更改的类型

检查清单：

  • 我的代码已经过测试。
  • 我的代码遵循WordPress代码风格。
  • 我的代码遵循可访问性标准。
  • 我的代码有适当的内联文档。
  • 如果合适的话，我已经包括了开发人员文档。
  • 我已经更新了所有受此PR中任何重构/重命名影响的React Native文件。

@sc81标准 sc81标准提到这个拉请求 2020年6月14日
正常开放
@泽布兰斯坦菲尔 泽布兰斯坦菲尔补充[类型]代码质量 与代码质量相关的问题或PR [功能]UI组件 影响或与UI组件系统相关 [Package]组件 /包/组件标签2020年6月15日
塔尔丹
塔尔丹 检验过的 2020年6月16日
查看已审阅的更改
packages/components/src/dropdown/index.js 过时的
线条上的注释30到44
const[isOpen，setIsOpen]=使用状态（false）；
const isFirstRender=useRef（true）；

this.toggle=this.toggle.bind（this）；
this.close=this.close.bind（this）；
this.closeIfFocusOutside=this.close IfFousOutside绑定（this）；

this.containerRef=创建Ref（）；

此状态={
isOpen:false，
};
}

组件WillUnmount（）{
const｛isOpen｝=this.state；
const{onToggle}=this.props；
if（isOpen&&onToggle）{
onToggle（false）；
}
}

组件DidUpdate（prevProps，prevState）{
const{isOpen}=此状态；
const{onToggle}=this.props；
if（prevState.isOpen！==isOpen&&onToggle）{
使用效果（（）=>{
if（是FirstRender.current）{
isFirstRender.current=false；
}else if（onToggle）{
onToggle（isOpen）；
}
}
返回（）=>{
if（isOpen&&onToggle）{
onToggle（false）；
}
};
}，[isFirstRender，isOpen，onToggle]）；
复制链接
贡献者

@塔尔丹 塔尔丹 2020年6月16日 •
已编辑

选择隐藏此评论的原因

将显示原因，以便向其他人描述此评论。了解更多信息。

我可能缺少一个实现细节，但我认为这里的目标是触发打开切换当状态更改时，现在也可以将其作为自定义挂钩进行处理，类似于以下未测试的伪代码：

//自定义挂钩。
功能 使用可观测状态( initialState（初始状态）, 状态更改时 ) {
    常数 [ 价值, setValue（设置值） ] = 使用状态( initialState（初始状态） );
    返回 [ 价值, ( newValue（新值） ) => { 
        setValue（设置值）( newValue（新值） ); 
        状态更改时( newValue（新值） );
    } ];
}

// ...

//组件中的用法。
常数 [ is打开, 设置为打开 ] = 使用可观测状态( 假, 打开切换 );

（我会将这个钩子函数放在同一文件中的组件之上）

卸载时仍需要一些单独的处理，但这样会变得更简单：

//卸载组件时触发“onToggle”。
使用效果( () => () => 打开切换( 假 ) );

复制链接
贡献者 作者

选择隐藏此评论的原因

将显示原因，以便向其他人描述此评论。了解更多信息。

对。这应该行得通。我稍后再检查。

塔尔丹
塔尔丹 批准了这些更改 2020年6月17日
查看已审阅的更改
复制链接
贡献者

@塔尔丹 塔尔丹 留下了评论

选择隐藏此评论的原因

将显示原因，以便向其他人描述此评论。了解更多信息。

谢谢你的贡献@sc81标准。很高兴文档和测试也作为其中的一部分进行了更新。

我注意到目前测试失败了。我认为值得尝试针对主分支重新设置PR并再次推送，因为我认为一些修复损坏测试的代码已合并到主分支。

@sc81标准
重构下拉菜单以使用功能组件
ea519f2 
*重构测试*重构DropdownMenu测试以消除奇怪的错误*添加onToggle和onClose属性的文档*添加useObservableState
@你知道riad
复制链接
贡献者

@塔尔丹我们应该合并这个吗？

@塔尔丹
复制链接
贡献者

塔尔丹 评论2020年6月24日 •
已编辑

是的，重新开始了测试，现在看起来很好👍

再次感谢你在这里所做的一切@sc81标准。

@塔尔丹 塔尔丹合并提交12亿390亿进入之内 WordPress（文字出版社）:主人 2020年6月24日
@github-操作 github-操作 机器人程序将此添加到古腾堡8.5里程碑2020年6月24日
@sc81标准
复制链接
贡献者 作者

没问题。谢谢你@塔尔丹

免费注册 在GitHub上加入此对话。已经有账户了吗？登录发表评论
审阅者

@塔尔丹 塔尔丹 塔尔丹批准了这些修改

@阿吉博拉 阿吉博拉 等待ajitbohra要求的审查

@克里斯万帕滕 克里斯万帕顿 等待chrisvanpatten的审查请求

@你知道riad 你知道riad 等待youknowriad的审查请求

受让人
未分配人员
标签
[功能]UI组件 影响或与UI组件系统相关 [Package]组件 /包/组件 [类型]代码质量 与代码质量相关的问题或PR
项目
还没有
里程碑
古腾堡8.5
开发

成功合并此请求可能会解决这些问题。

还没有
4名参与者
@sc81标准 @你知道riad @塔尔丹 @泽布兰斯坦菲尔