@cainiaofe/cn-ui-m-lowcode/src/common/setter/datasource-setter/datasource-setter.js

## 在线文档

import React from 'react';
const { SelectControl } = window?.VisualEngineUtils || {};

import './index.scss';
import { getDataSourceList } from '../../util/util';

class DataSourceSetter extends React.Component {
  state = {
    dataSourceList: [],
  };

  componentDidMount() {}

  componentWillMount() {
    const { prop } = this.props;
    // 监听
    this.willDetach = prop.onValueChange(() => this.forceUpdate());
  }

  componentWillUnmount() {
    // 卸载监听
    this.willDetach && this.willDetach();
  }

  getDsName = () => {
    let value = '';
    const { prop } = this.props;
    try {
      // const dsExpr = prop.getNode().getPropValue(prop.getName())
      const dsExpr = prop.getHotValue();
      const variableStr = prop.getVariableValue();
      if (dsExpr && dsExpr.type === 'variable' && dsExpr.variable) {
        value = dsExpr.variable.slice(dsExpr.variable.lastIndexOf('.') + 1);
      } else if (variableStr) {
        value = variableStr.slice(variableStr.lastIndexOf('.') + 1);
      }
    } catch (e) {
      console.log('error');
    }
    return value;
  };

  render() {
    let dataSourceList = [];
    const dsName = this.getDsName();
    if (!dsName) {
    }
    dataSourceList = getDataSourceList({
      typeList: ['VALUE'],
    });
    if (Array.isArray(dataSourceList)) {
      dataSourceList = dataSourceList.map((item) => {
        const newLabel = `${item.label} (${item.value})`;
        return {
          ...item,
          label: newLabel,
          text: newLabel,
        };
      });
    }
    return <SelectControl readOnly options={dataSourceList} value={dsName} />;
  }
}

export default DataSourceSetter;