[Feat] Support disabling or targeting the second `.pac-container` injected by Google Autocomplete
维护者通常 2 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 5/5
- 预计耗时
- 一周以上
- 新手友好度
- 25/100
- Issue 类型
- 功能
- 描述清晰度
- 需要澄清
- 活跃度
- 停滞
- 技术栈
- react, typescript
- 领域
- frontend
调研方向
从 组件入手，使用 Google Places Autocomplete widget 重现注入的两个 .pac-container 元素。检查 Google Maps JavaScript API 是否允许禁用或定位第二个容器，然后确定是否可行地支持一个 prop，或者是否应记录这一限制。
由索引模型根据 Issue 内容生成。
描述
Target Use Case
Hi 👋 and thank you for the great work on this library!
I'm currently using the <Autocomplete> component from @react-google-maps/api and I noticed that, when the Google Places Autocomplete widget is initialized, it injects two div.pac-container elements into the DOM.
- The first seems to contain the actual place predictions.
- The second appears to be used for internal styling or highlight rendering.
While this behavior comes from the underlying Google Maps JavaScript API, it creates styling and layout issues in certain cases (e.g., inside modals or custom UI containers), especially when trying to apply scoped CSS in a React app.
Feature Request
Would it be possible to expose a prop or configuration option on the <Autocomplete> component that allows:
- Either disabling the second
.pac-container(if safe and feasible), or - Assigning a custom className or wrapper element to help us target it more precisely with CSS.
Even though this is mostly controlled by Google’s API, some developers might benefit from being able to more easily identify or interact with the injected containers.
Alternatives Considered
I tried this but it doesn't work
.pac-container:nth-of-type(2) {
display: none !important;
}
Context
I'm using the latest version of the library with React 18, and I've confirmed the behavior is consistent across several environments. If there's a known workaround or best practice for this case, I'd appreciate any pointers!
Thanks again for your hard work 🙏
Proposal
I don't have any proposal for now
- 主要语言
- TypeScript
- 星标
- 1.9k
- 派生
- 195
- 平均合并
- 2 天 11 小时
- 30 天内合并 PR
- 14
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 没有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
visgl/react-google-maps 的其他 Issue
-
google maps issue
难度 3/5 1-2 天 新手友好度 74/100
visgl/react-google-maps#1080 · 1 条评论 ·
维护者通常 2 天内回复
-
bug needs more info
难度 3/5 1-2 天 新手友好度 45/100
visgl/react-google-maps#1039 · 1 条评论 ·
维护者通常 2 天内回复
-
bug
难度 4/5 3-5 天 新手友好度 35/100
visgl/react-google-maps#918 · 9 条评论 ·
维护者通常 2 天内回复
-
bug
难度 4/5 3-5 天 新手友好度 45/100
visgl/react-google-maps#905 ·
维护者通常 2 天内回复
-
google maps issue
难度 3/5 1-2 天 新手友好度 45/100
visgl/react-google-maps#889 · 1 条评论 ·
维护者通常 2 天内回复
查看 visgl/react-google-maps 的全部 Issue
相似的 Issue
-
Mend: dependency security vulnerability untriaged
难度 2/5 1-3 小时 新手友好度 68/100
opensearch-project/security-dashboards-plugin#2545 ·
维护者通常 1 天内回复
-
Add: Dream TR SD未关闭check:passed streams:add
难度 2/5 1-3 小时 新手友好度 70/100
维护者通常 1 天内回复
-
doctor integrity sample scans soft-deleted pages on Postgres (batch path has no deleted_at filter)未关闭
难度 2/5 1-3 小时 新手友好度 88/100
维护者通常 1 天内回复
-
难度 1/5 1 小时以内 新手友好度 72/100
SocialGouv/egapro#4672 · 1 条评论 ·
维护者通常 2 天内回复
-
area:agents area:tui bug
难度 2/5 1-3 小时 新手友好度 74/100
anthropics/claude-code#98358 ·
维护者通常 1 天内回复