index.md 5.31 KB

选择表单

使用外部appId获取options

import { request, QxFormSelect } from '@qx/common';
import React, { useState } from 'react';

export default () => {
  const [value, setValue] = useState({
    formId: 'PbOC6xBYOvZ1IB2mwUc',
    appId: 'eSnLZ42R2TA5Z18dNsJ'
  });
  return (
    <QxFormSelect
      value={value}
      onChange={(datasource) => {
        console.log('datasource ===', datasource);
        setValue(datasource);
      }}
      request={request}
      appId={'C9QUrtTmcmDkvHMoOKI'}
      disabled
    />
  );
};

外部传入options

import { request, QxFormSelect } from '@qx/common';
import React, { useState } from 'react';

export default () => {
  const [value, setValue] = useState({});
  const options = [
    {
      name: '地址',
      code: 'UdXaoSj9EHYr3wZL253',
      extract: {
        code: 'o72gf',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '测试关联记录按钮',
      code: 'ZRLa6NjJ98u3lFVLSur',
      extract: {
        code: 'vwxxw',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '测试关联记录权限',
      code: 'SRqC0JJmcjKquqnn228',
      extract: {
        code: '60jte',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '子表',
      code: 'GYsqE8yphn1amjVM2OY',
      extract: {
        code: 'oi0d2',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联基础',
      code: '2wN04K7nF0fHjRbOAvu',
      extract: {
        code: '0jpbl',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联记录',
      code: 's6k5W5aovjtiU7kvqVl',
      extract: {
        code: 'zbynu',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联记录-关联记录',
      code: 'hfbs4k6Lbs4WV7tOept',
      extract: {
        code: 'fz7nl',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联属性-关联记录',
      code: 'WPjXCOemcBxoXqeEX6x',
      extract: {
        code: 's585f',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '子表-关联记录',
      code: 'H3moABKMnhVqjqcVbsa',
      extract: {
        code: 'snfhq',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联记录1',
      code: 'PQspcwgyiewytF9iizd',
      extract: {
        code: 'f53ql',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '富文本',
      code: 'On7QbrZv9u1qtVgMAGm',
      extract: {
        code: 'tmh23',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联记录删除',
      code: 'MdUFSBxWOYKXSYGSqSk',
      extract: {
        code: 'uxenf',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '1',
      code: 'HAJ8dEcoPLnjx81Uxjc',
      extract: {
        code: '3xtcr',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '基础表单',
      code: 'oOY4njEfrHx7PlSlFRf',
      extract: {
        code: 'fd3eb',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '关联记录',
      code: 'HaIdxngReF8WtKclakp',
      extract: {
        code: 'qbroi',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '筛选',
      code: 'amWz1TlerTCrysLhKdD',
      extract: {
        code: 'ionr7',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '子表',
      code: 'JV5IeD1Xc4MtwWdbPhB',
      extract: {
        code: 'x4lh4',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '附件图片',
      code: 'jCfTNFw7tjERB5jnnWv',
      extract: {
        code: 'pqqko',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '日期时间',
      code: 'WruqGjaxMj0jLsZ6Ufr',
      extract: {
        code: 'z15we',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '选人员部门',
      code: 'wqsubyh5kJFsxXuHYyQ',
      extract: {
        code: '0h42r',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '数值',
      code: 'HEsh8KhnUToggsWuboT',
      extract: {
        code: 'bb8ev',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
    {
      name: '多字段',
      code: 'deTV0Jjc1prqYZTERfN',
      extract: {
        code: 'hxaxj',
        isTree: false,
        appName: 'LT-表单',
        type: 'form',
      },
    },
  ];

  return (
    <QxFormSelect
      options={options}
      value={value}
      onChange={(datasource) => {
        console.log(datasource, 'lllllll');
        setValue(datasource);
      }}
      request={request}
    />
  );
};