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

a-input-number和table冲突 #28239

Closed
1 task
hdtopku opened this issue Dec 7, 2020 · 5 comments
Closed
1 task

a-input-number和table冲突 #28239

hdtopku opened this issue Dec 7, 2020 · 5 comments
Labels
🤔 Need Reproduce We cannot reproduce your problem

Comments

@hdtopku
Copy link

hdtopku commented Dec 7, 2020

  • I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

http://baidu.com

Steps to reproduce

表格中固定一栏,并在单元格中添加a-input-number,鼠标悬浮在固定栏时,就会出现input的加减按钮。

What is expected?

鼠标悬浮至fix栏目的删除按钮上,a-input-number的加减按钮不应该显示出来

What is actually happening?

鼠标悬浮至fix栏目的删除按钮上,a-input-number的加减按钮就显示出来,高度覆盖了fix栏的删除按钮,并且可以点击计数加减按钮,影响了删除按钮的点击。

Environment Info
antd 4.9.2
React react
System macos
Browser chrome 86.0.4240.183

图片地址:https://user-images.githubusercontent.com/14859466/101332335-1d2fbf00-38b0-11eb-8436-363a7a2ea215.png

@zombieJ
Copy link
Member

zombieJ commented Dec 7, 2020

试了一下是好的,给个重现看看: https://codesandbox.io/s/gudinglie-antd492-forked-07qef

@zombieJ zombieJ added the 🤔 Need Reproduce We cannot reproduce your problem label Dec 7, 2020
@ant-design-bot
Copy link
Contributor

Hello @hdtopku. Please provide a online reproduction by forking this link https://u.ant.design/codesandbox-repro or a minimal GitHub repository. Issues labeled by Need Reproduce will be closed if no activities in 7 days.

你好 @hdtopku, 我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击 此处 创建一个 codesandbox 或者提供一个最小化的 GitHub 仓库。7 天内未跟进的 issue 将会被自动关闭。

@hdtopku
Copy link
Author

hdtopku commented Dec 7, 2020

试了一下是好的,给个重现看看: https://codesandbox.io/s/gudinglie-antd492-forked-07qef

试了一下,能复现了。
在table外嵌套,就会出现问题。
并且Form的layout 是inline ,导致select样式问题
👆正如链接的issues中提到的,是a-form和a-input、a-input-number、a-select之间的遗留的历史问题。

村里网不好,打不开codesandbox,将就一下。框架是antdv

<template>
  <a-form>
    <a-form-item>
      <a-table :columns="columns" :data-source="data" :scroll="{ x: 1300 }">
        <template #input>
          <a-input-number></a-input-number>
        </template>
        <template #action="{ text }">
          <a>action</a>
        </template>
      </a-table>
    </a-form-item>
  </a-form>
</template>
<script>
  const columns = [
    { title: 'Full Name', width: 100, dataIndex: 'name', key: 'name', fixed: 'left' },
    { title: 'Age', width: 100, dataIndex: 'age', key: 'age', fixed: 'left' },
    { title: 'Column 1', dataIndex: 'address', key: '1' },
    { title: 'Column 2', dataIndex: 'address', key: '2' },
    { title: 'Column 3', dataIndex: 'address', key: '3' },
    { title: 'Column 4', dataIndex: 'address', key: '4' },
    { title: 'Column 5', dataIndex: 'address', key: '5', slots: { customRender: 'input' } },
    { title: 'Column 6', dataIndex: 'address', key: '6' },
    { title: 'Column 7', dataIndex: 'address', key: '7' },
    { title: 'Column 8', dataIndex: 'address', key: '8' },
    {
      title: 'Action',
      key: 'operation',
      fixed: 'right',
      width: 100,
      slots: { customRender: 'action' },
    },
  ]

  const data = [
    {
      key: '1',
      name: 'John Brown',
      age: 32,
      address: 'New York Park',
    },
    {
      key: '2',
      name: 'Jim Green',
      age: 40,
      address: 'London Park',
    },
  ]

  export default {
    data() {
      return {
        data,
        columns,
      }
    },
  }
</script>

@afc163
Copy link
Member

afc163 commented Dec 7, 2020

报错地方了,这里是 React 的库。

@afc163 afc163 closed this as completed Dec 7, 2020
@hdtopku
Copy link
Author

hdtopku commented Dec 7, 2020

报错地方了,这里是 React 的库。

由于,antdvnewIssue一直无法访问,没办法联系到antdv那边
原以为antd和antdv库是共享的,所以才过来提问。打扰了

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🤔 Need Reproduce We cannot reproduce your problem
Projects
None yet
Development

No branches or pull requests

4 participants