圖片上傳組件。用于單個或多個圖片上傳。用于圖片上傳、刪除、預覽、排序功能。
> 該組件支持v-model獲取當前值。
## 屬性
| 參數 | 說明 | 類型 | 可選值 | 默認值
| --- | --- | --- | --- | ---
| api | 配置文件接收地址,組件會通過二進制數據post給該地址。 | string | 必填 |
| api-param | 上傳時攜帶的參數內容,除了上傳的二進制數據之外,組件還會攜帶該對象參數。 | object | |
| success-tip | 上傳請求返回成功結果之后采用什么方式提醒 | string | none,message,alert,notify | message
| fail-tip | 上傳請求返回失敗結果之后采用什么方式提醒 | string | none,message,alert,notify | alert
| order-enable | 是否允許進行排序 | boolean | | true
| delete-api | 刪除操作回調的后端接收地址。 | string | 必填 |
| delete-method | 刪除操作回調的后端接收方法。 | string | 必填 |
| delete-param | 刪除操作回調的后端接收參數,除了主鍵值之外,組件還會攜帶該對象參數。 | object | |
| delete-success-tip | 刪除操作返回成功結果之后采用什么方式提醒 | string | none,message,alert,notify | none
| delete-fail-tip | 刪除操作返回失敗結果之后采用什么方式提醒 | string | none,message,alert,notify | alert
| preview-url | 設置用于預覽的url地址,組件會自動get請求該地址并攜帶一個參數,由primary-key屬性指定的參數。 | string | |
| primary-key | 主鍵值,該值用于指定組件各項功能操作的主鍵值。 | string | | id
| ajax-header | 是否包含有ajax頭,x-requested-with:XMLHttpRequest。 | boolean | | true
| init-data | 初始化filelist數據,數據格式:[id(或指定的primarykey):"123456",url:"圖片地址"(如果不提供的話,會使用preview組合地址)] | boolean | | true
| file-list | 已上傳的圖片文件列表。支持sync修飾符。 | array | |
## 事件
| 事件 | 說明 | 參數
| --- | --- | ---
| uploaded | 文檔上傳成功,使用自定義uploadSuccessFn方法后此事件失效。 | {res: 上傳請求響應, file: 上傳成功的文檔對象信息}
| removed | 請求服務端刪除附件成功。使用自定義removeFn方法后此事件失效。 | {res: 上傳請求響應, file: 上傳成功的文檔對象信息}
| file-deleted | 文件刪除成功事件,使用自定義removeFn方法后此事件失效。 | {data:被刪除的文檔對象信息}
| file-up | 將文件順序前移事件 | { file:移動的文件對象信息, fileList: 移動后的文件對象數組 }
| file-down | 將文件順序后移事件 | { file:移動的文件對象信息, fileList: 移動后的文件對象數組 }
| reset | 重置事件 |
| 其他 | 支持所有el-upload事件。
## 插槽
| 插槽名 | 說明
| --- | ---
| tip | 提示說明文字
- 序言
- 安裝
- 組件查詢
- buttons
- WdApiButton
- WdDrawerButton
- WdRefreshButton
- WdRouteButton
- WdConfirmButton
- datagrid
- WdDatagrid
- WdGridDeleteButton
- WdGridEnableButton
- editgrid
- WdEditgrid
- WdEditgridCell
- element
- WdCard
- WdCollapse
- WdDrawerIframe
- WdIframe
- WdLabel
- WdSplitLabel
- WdDetail
- WdToolBar
- WdRepeater
- WdApiManager
- form
- WdDataForm
- WdSelect
- WdRadioList
- WdCheckboxList
- WdUploadImage
- search
- WdSearchCheckbox
- WdSearchDatepick
- WdSearchForm
- WdSearchInput
- WdSearchRadio
- WdSearchSelect
- tree
- WdTree
- 內置服務
- ajax服務
- 消息服務
- 框架方法
- tab操作
- 其他
- demo說明