@sula/plugin-form-dependency v0.1.12

{
  name: 'things',
  remoteSource: {
    url: '/fetch/source',
    params: {},
    convertParams: () => {},
    converter: () => {},
  },
  dependency: {
    source: {
      relates: ['food', 'fruit'], // 全局设置
      cases: [{
        inputs: ['potato', 'apple'],
        output: [{text: '桌子', value: 'desk'}]
      }, {
        relates: ['food'], // 优先级高于全局
        inputs: ['tomato'],
        output: [{text: '窗户', value: 'window'}]
      }, {
        relates: ['fruit'], // 如果不配置inputs和outputs，就会自动与remoteSource结合，并把fruit的值作为请求参数
      }, {
        relates: ['food'],
        type: 'custom-source-dep', // 通过插件扩展点 depend 透出，让用户自己实现更定制化的关联操作
      }],
      default: [],
      ignores: [undefined, undefined], // [undefined, [undefined, 'unknown']]
    },
    value: {
      
    },
    visible: {
      relates: ['fruit'],
      cases: [{
        inputs: ['apple', 'peach'], // 如果fruit取apple或peach，则该组件不显示
        output: false,
      }],
      default: true,
    },
    disabled: {

    }
  }
}

class CustomDep {
  apply(api) {
    api.syncHooks.depend((ctx) => {
      const {
        dependency,  // source, value, visable, disabled
        type, // custom-source-dep,
        relatesValue, // 根据relates获取的value
        form
      } = ctx;
      // 实现定制化关联场景
    })
  }
}

@峻文的二元思路

{
  name: 'things',
  remoteSource: {
    url: '/fetch/source',
    params: {},
    convertParams: () => {},
    converter: () => {},
  },
  dependency: {
    source: {
      cases: [{
        relates: ['food', 'fruit'],
        condition: 'AND',
        operateor: 'EQUAL',
        inputs: ['potato', 'apple'],
        output: [{text: '桌子', value: 'desk'}]
      }, {
        relates: ['food'],
        condition: 'OR',
        inputs: ['tomato', {
          relates: ['fruit', 'drink'],
          condition: 'AND',
          operateor: 'NOT_EQUAL',
          inputs: ['apple', 'coca-cola'],
        }],
        output: [{text: '窗户', value: 'window'}]
      }, {
        relates: ['fruit'], // 如果不配置inputs和outputs，就会自动与remoteSource结合，并把fruit的值作为请求参数
      }, {
        relates: ['food'],
        type: 'custom-source-dep', // 通过插件扩展点 depend 透出，让用户自己实现更定制化的关联操作
      }],
      default: [],
      ignores: [undefined, undefined], // [undefined, [undefined, 'unknown']]
    },
    value: {
      
    },
    visible: {
      relates: ['fruit'],
      cases: [{
        inputs: ['apple', 'peach'], // 如果fruit取apple或peach，则该组件不显示
        output: false,
      }],
      default: true,
    },
    disabled: {

    }
  }
}

@峻文的二元思路的改版

{
  name: 'things',
  remoteSource: {
    url: '/fetch/source',
    params: {},
    convertParams: () => {},
    converter: () => {},
  },
  dependency: {
    source: {
      cases: [{
        relates: ['food', 'fruit'],
        condition: 'AND',
        operateor: 'EQUAL',
        inputs: ['potato', 'apple'],
        output: [{text: '桌子', value: 'desk'}]
      }, {
        relates: ['food'],
        condition: 'OR',
        inputs: ['tomato', {
          relates: ['fruit', 'drink'],
          condition: 'AND',
          operateor: 'NOT_EQUAL',
          inputs: ['apple', 'coca-cola'],
        }],
        output: [{text: '窗户', value: 'window'}]
      }, {
        relates: ['fruit'], // 如果不配置inputs和outputs，就会自动与remoteSource结合，并把fruit的值作为请求参数
      }, {
        relates: ['food'],
        type: 'custom-source-dep', // 通过插件扩展点 depend 透出，让用户自己实现更定制化的关联操作
      }],
      default: [],
      ignores: [undefined, undefined], // [undefined, [undefined, 'unknown']]
    },
  }
}