Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

The submenu cannot hide after animation end or mouse leave

オープン
#417 コメント 0 件 リアクション 3 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
35/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
停滞
技術スタック
react, typescript
領域
frontend

調査の方向性

まず、提供された CustomMenu の例で動作を再現し、rc-menu で使用されているサブメニューのホバーおよびマウス移動の処理を調べます。アニメーションと mouse-leave の経路を確認し、その後、アニメーションの完了後またはポインターが領域から離れたときに、サブメニューが確実に非表示になることを確認します。

索引モデルが issue の本文から書いたものです。

説明

source code:

import * as React from 'react';
import Menu, { SubMenu, MenuItem } from 'rc-menu';
import classNames from 'classnames';
import 'rc-menu/assets/index.css';

const horizontalMotion = {
  motionName: 'rc-menu-open-slide-up',
  motionAppear: true,
  motionEnter: true,
  motionLeave: true
};

const children = [
  <MenuItem key="1">认识小新</MenuItem>,
  <SubMenu key="2" title="到店体验">
    <MenuItem key="2-1">2-1</MenuItem>
  </SubMenu>,
  <SubMenu key="3" className="submenu" title="关于我们">
    <MenuItem key="3-1">企业介绍</MenuItem>
    <MenuItem key="3-2">媒体中心</MenuItem>
    <MenuItem key="3-3">加入我们</MenuItem>
  </SubMenu>,
  <SubMenu key="4" title="探索更多">
    <MenuItem key="4-1">4-1</MenuItem>
  </SubMenu>
];

export default class CustomMenu extends React.PureComponent {
  render() {
    this.config = {
      triggerSubMenuAction: 'hover',
      mode: 'horizontal',
      defaultMotions: { horizontal: horizontalMotion }
    };
    return (
      <Menu defaultActiveFirst {...this.config}>
        {children}
      </Menu>
    );
  }
}
主要言語
TypeScript
スター
701
フォーク
266
平均マージ
4日 11時間
マージ済み PR(30日)
3

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

react-component/menu のほかの issue

react-component/menu の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。