全局配置

I used to rule the world

Seas would rise when I gave the word

Upload

你可以在全局配置中配置 Upload 组件的默认行为

import { globalConfig } from 'dangoui'

app.use(globalConfig, {
  upload: {
    beforeUpload(file) {
      file.action =
        'https://run.mocky.io/v3/de7ed31f-93f1-4143-b25e-c9249cd77a5c'
      file.name = 'file'
      return file
    },
    beforeResponse(file) {
      if (file.statusCode === 200) {
        const json = JSON.parse(file.responseText ?? '{}')
        file.url = json.url
        file.thumbUrl = json.url
        file.status = 'done'
      } else {
        file.status = 'error'
      }
      return file
    },
  },
})

Image

你可以在全局配置中为 Image 组件配置图片转换逻辑

import { globalConfig } from 'dangoui'

app.use(globalConfig, {
  image: {
    providers: [
      {
        test: /^https:\/\/cdn\.qiandaoapp\.com/,
        getImage(src, options) {
          if (options.modifiers.width < 300) {
            return {
              url: src + '!lfit_w240_jpg',
            }
          }

          return {
            url: src,
          }
        },
      },
    ],
  },
})

尺寸转换

比如在小程序中，我们可能会使用 rpx 进行设计稿的还原，为了方便对设计稿进行还原，可以在全局配置尺寸单位的转换，对于一些组件跟尺寸相关的属性，会遵循这个转换逻辑（不是所有，待完善文档能够方便地知道）

因为全局配置会影响整个项目，目前我们克制地仅放出对无单位的数字类型进行转换，并且不是所有属性都会进行转换

import { globalConfig } from 'dangoui'

app.use(globalConfig, {
  unitTransform: {
    // 对什么单位进行转换，目前仅支持无单位的数字类型
    number: true,
    // 设计稿宽度
    designWidth: 375,
  }
})

比如 DuIcon 的 size 属性就会遵循这个转换逻辑，配置之后，假设我们的设计稿是 375px，其中有一个 16px 的图标，我们像下面的代码这样写，最终转换出来的尺寸为 32rpx

<DuIcon name="wifi" :size="16" />