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

🐛[BUG] ProTable columns中配置valueType:'select' +request时,搜索完选中值后会触发一次新的搜索 #8780

Open
Chryseis opened this issue Oct 9, 2024 · 3 comments

Comments

@Chryseis
Copy link

Chryseis commented Oct 9, 2024

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🐛 bug 描述

在ProTable columns中配置了一个远程下拉搜索框

 {
      title: '测试',
      dataIndex: 'test',
      hideInTable: true,
      valueType: 'select',
      request: async params => {
        console.log(params)
        const result = await fetchData({ name: params.keyWords || '' })

        return result?.map(({ id: value, name: label }) => {
          return { label, value }
        })
      },
      defaultKeyWords: '',
      fieldProps: {
        showSearch: true,
        placeholder: '请输入',
      },
    },

📷 复现步骤

  1. 输入框搜索内容
  2. 选中一个值

🏞 期望结果

选中值后不触发请求

💻 复现代码

https://codesandbox.io/p/sandbox/qgnx8z

© 版本信息

  • ProComponents 版本:2.6.42
  • umi 版本 未使用
  • 浏览器环境 Chrome 129
  • 开发环境 macOS

🚑 其他信息

@cyc2016
Copy link

cyc2016 commented Dec 6, 2024

选中值后触发的请求中传来的keyWords值是undefined,这种情况可以在request这里做处理,不发送请求,例如

request: async params => {
  if (params.keyWords === undefined) return [];
  const result = await fetchData({ name: params.keyWords || '' })
  return result?.map(({ id: value, name: label }) => {
    return { label, value }
  })
},

@Chryseis
Copy link
Author

Chryseis commented Dec 6, 2024

选中值后触发的请求中传来的keyWords值是undefined,这种情况可以在request这里做处理,不发送请求,例如

request: async params => {
  if (params.keyWords === undefined) return [];
  const result = await fetchData({ name: params.keyWords || '' })
  return result?.map(({ id: value, name: label }) => {
    return { label, value }
  })
},

这样做确实可以避免二次请求,但上一次请求的的数组也就丢失了,那你在交互的时候会发现你上次选择的值没有出现在列表中

@Chryseis
Copy link
Author

Chryseis commented Dec 6, 2024

目前比较完美的解决方案是自己写一个select的组件,然后实现value和onChange事件匹配form

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

No branches or pull requests

2 participants