VJSF发起AJAX请求提示No http lib found报错原因排查

报错产生原因 #

VJSF 组件本身没有内置 HTTP 请求能力，所有 AJAX 相关操作都需要使用者主动传入适配的请求实例才能执行。官方示例可正常运行是因为官方演示环境预先配置了全局请求工具，本地项目未完成对应配置就会触发该报错。

解决方案 #

方式一：使用 axios 适配（推荐） #

• 安装 axios 依赖：

npm install axios

• 修改代码，在 VJSF 的 options 配置中传入 axios 实例：

// 原有导入代码后新增axios导入
import axios from 'axios'

const options =  {
    // 新增httpLib配置，传入axios实例
    httpLib: axios,
    context: {
        owner: {
            type: 'organization',
            id: '5a5dc47163ebd4a6f438589b'
        }
    },
    idPrefix: 'example-select-http-'
}

方式二：自定义请求工具适配 #

如果项目中使用其他请求工具，可自行封装符合VJSF要求的请求实例传入，只需实现get方法并返回Promise即可，示例如下：

const customHttpLib = {
  get: (url, config) => {
    // 此处使用fetch或你项目内的其他请求工具实现逻辑
    return fetch(url, {
      ...config,
      method: 'GET'
    }).then(res => res.json())
  }
}

const options =  {
    httpLib: customHttpLib,
    // 其他原有配置不变
}

修改完成后重新运行项目即可正常发起AJAX请求填充下拉框。

内容的提问来源于stack exchange，提问作者snowman729