开发者社区> 问答> 正文

宜搭自定义页面问题

在自定义页面中加了下拉选择这个组件,在查询里面,想在下拉选择中可以绑定数据源的数据,image.png
如何将项目名称这个组件改为下拉选择的组件,将在下拉选择中显示项目名称所有内容,主要现在项目名称只有一个显示,每次都要自己输入数据,才能出现那个页面

展开
收起
游客3wvjglhzp4cwa 2023-11-03 17:10:00 147 0
4 条回答
写回答
取消 提交回答
  • 十年摸盘键,代码未曾试。 今日码示君,谁有上云事。

    宜搭表单和自定义页面,都有下拉单选组件,不同的是表单中叫“下拉单选”,自定义页面叫“下拉选择”,其实两者功能都一样,只是在不同页面中的不同叫法而已。

    自定义页面下拉选项中

    text对应的是显示值;value是组件值,即this.$("selectField_kvnwz0n2").getValue()

    如果还想保存其它信息,都可以往里塞。可以通过动作export function onChange({value, actionType, item})的item获取,

    自定义页面下拉单选组件作为查询条件时是精确搜索,如果为空的话也是会参与搜索的,此时需要写判断条件如果哪一个下拉为空的话,参数中就不要传这个下拉的值。 

    2023-11-05 14:46:55
    赞同 1 展开评论 打赏
  • 面对过去,不要迷离;面对未来,不必彷徨;活在今天,你只要把自己完全展示给别人看。

    你可以使用下拉列表控件来代替项目名称的文本输入框。下拉列表可以预设多个选项供用户选择,这样用户就不需要每次都输入项目名称了。你需要先定义一个包含所有项目的数组,然后将其赋给下拉列表控件。当用户从下拉列表中选择一个项目时,你可以在事件处理器中更新页面的状态以显示相应的页面内容。

    2023-11-04 21:51:22
    赞同 展开评论 打赏
  • 如果你想要将项目名称组件改为下拉选择的组件,可以在现有的项目名称组件的基础上添加一些新的功能。下面是一个简单的示例:

    import React from 'react';
    import { Select } from 'antd';
    
    const ProjectName = ({ onChange }) => {
      const [value, setValue] = useState('');
    
      useEffect(() => {
        // 加载项目名称的所有内容
        fetch('https://example.com/projects')
          .then(res => res.json())
          .then(data => {
            const options = data.map(item => ({
              label: item.name,
              value: item.id
            }));
            setValue(options);
          });
      }, []);
    
      return (
        <Select
          placeholder="请选择项目"
          value={value}
          onChange={onChange}
        >
          {value.map(item => (
            <Option key={item.value} value={item.value}>
              {item.label}
            </Option>
          ))}
        </Select>
      );
    };
    
    export default ProjectName;
    

    在这个示例中,我们首先定义了一个 ProjectName 组件,它接受一个 onChange 回调函数作为 props。在 useEffect 钩子中,我们在组件挂载时加载项目名称的所有内容,并将其转换为 option 对象数组。然后,我们在 return 语句中返回一个 Select 组件,其中包含了所有的项目名称 option
    当你在一个表单或其他地方使用 ProjectName 组件时,你可以像这样设置 onChange 回调函数:

    const handleProjectChange = value => {
      console.log(`Selected project id: ${value}`);
    };
    

    然后,你可以将 handleProjectChange 函数作为 onChange prop 传递给 ProjectName 组件:

    <ProjectName onChange={handleProjectChange} />
    
    2023-11-04 14:10:39
    赞同 展开评论 打赏
  • 在宜搭自定义页面中,如果您想要将项目名称组件改为下拉选择的组件并显示所有项目名称内容,您可以按照以下步骤操作:

    1. 首先,您需要在数据源中添加您的项目名称数据。这样,下拉选择组件就可以绑定到这个数据源。
    2. 接下来,在自定义页面上添加一个下拉选择组件。
    3. 然后,将下拉选择组件的属性设置为“数据源”并选择您之前创建的项目名称数据源。这样,下拉选择中就会显示项目名称的所有内容。
    4. 最后,保存并发布自定义页面。
    2023-11-03 23:41:05
    赞同 展开评论 打赏
问答分类:
问答地址:
关联地址:
问答排行榜
最热
最新

相关电子书

更多
宜搭 - 企业智能化应用搭建平台 立即下载
《云市场-宜搭解决方案》 立即下载
《宜搭开发手册》 立即下载