XFile

<div class="layui-form-item">
    <label class="layui-form-label">Список вложений</label>
    <div class="layui-input-block">
        <input type="text" name="ar_files" id="ar_files" class="layui-input" >
    </div>
</div>

layui.use(["xFile"],function(){
    let xFile = layui.xFile;
    xFile.render({
    	id: 'ar_files',
    	base: '/assets/layuiadmin/start/layui/lay/modules/xFile/',
    	url: '/file/upload',
    	cropImages: true,
    	accept: 'file',
    	multiple: true,
    	rewriteFormValue: function(values){
    		let value = []
    		if (values) {
    			values.forEach(function(val){
    				value.push(val.file_id);
    			})
    		}
    		return value.join(",");
    	},
    	initValues: initValues,
    });
});

// Базовая конфигурация, основанная на конфигурации модуля upload библиотеки layui с некоторыми дополнениями
let defaultConfig = {
	id: undefined, // Идентификатор элемента рендеринга
	// base: "", // Путь к веб-адресу компонента xFile для доступа к другим js и css файлам, по умолчанию текущий путь
	url: undefined, // URL серверного интерфейса загрузки, формат возвращаемых данных см. ниже
	data: undefined, // Дополнительные параметры запроса к интерфейсу загрузки. Например: data: {id: 'xxx'}
	headers: undefined, // Заголовки запроса. Например: headers: {token: 'sasasas'} (добавлено в версии layui 2.2.6)
	// accept: 'images', // Разрешённые типы файлов при проверке во время загрузки, возможные значения: images (изображения), file (все файлы), video (видео), audio (аудио)
	// acceptMime: 'image/*', // Список MIME-типов файлов, которые будут отображаться при открытии окна выбора файлов. Например: acceptMime: 'image/jpg, image/png' (только jpg и png файлы) (добавлено в версии layui 2.2.6)
	// exts: imgExts,//'jpg|png|gif|bmp|jpeg', // Допустимые расширения файлов для загрузки. Обычно используется вместе с параметром accept. Если accept не задан, то ограничиваются только изображениями.
	auto: true, // Автозагрузка после выбора файлов. Если установлено значение false, необходимо настроить bindAction для отправки загрузки с другой кнопки.
	multiple: false, // Разрешить загрузку нескольких файлов. Установите значение true для включения. Не поддерживается в IE8/9. По умолчанию: false
	size: 0, // Максимальный размер файла для загрузки в килобайтах. Не поддерживается в IE8/9, 0 означает отсутствие ограничений
	field: 'file', // Имя поля файла
	bindAction: undefined, // Ссылка на кнопку, которая инициирует загрузку. Значение может быть селектором или объектом DOM. Например: bindAction: '#btn',string/object
	drag: true, // Разрешает перетаскивание файлов для загрузки, установите значение false для отключения. Не поддерживается в IE8/9
	choose: function (object) {
		return object;
	}, // Функция обратного вызова после выбора файла. Возвращает объект параметра. Подробнее ниже
	before: function (object) {
		return object;
	},  // Функция обратного вызова перед загрузкой файла. Возвращает объект параметра (тот же, что и выше). Подробнее ниже	function	-
	progress: function (res, index, upload) {
		return res;
	}, // Функция обратного вызова прогресса загрузки файла. Возвращает три параметра: res (ответ сервера), index (индекс текущего файла) и upload (метод повторной загрузки, обычно используется после неудачной загрузки). Подробнее ниже	function	-
	done: function (res, index, upload) {
		return res;
	}, //	Функция обратного вызова после успешной загрузки файла. Возвращает три параметра: res (ответ сервера), index (индекс текущего файла) и upload (повторная загрузка). Подробнее ниже	function	-
	error: function (index, upload) {
	}, //Функция обратного вызова при возникновении ошибки при загрузке файла (обычно это сетевые ошибки или 404 ошибки URL). Возвращает два параметра: index (индекс текущего файла) и upload (повторная загрузка). Подробнее ниже	function
	// rewriteFormValue: function(values){ return JSON.stringify(values) }, // Функция перезаписи значения формы по умолчанию
	number: 0, // Максимальное количество одновременно загружаемых файлов, обычно используется вместе с multiple. Обратите внимание: этот параметр добавлен в версии layui 2.2.3, number 0 (без ограничений)
	cropImages: false, // Обрезать изображение
	cropWidth: 180, // Ширина обрезки изображения
	cropHeight: 180 // Высота обрезки изображения
}

{
    success: true,
    msg: ''，
    data: {
        file_id: '10101010101', // Идентификатор файла
        file_name: '123.jpg', // Название файла
        file_suffix: 'jpg', // Расширение файла
        file_url: 'http://xxx.xxx.xxx/xxx/xxxxx', // Адрес предварительного просмотра файла     
    }
}

let initValues = [
    {
        file_id: '10101010101', // Идентификатор файла
        file_name: '123.jpg', // Название файла
        file_suffix: 'jpg', // Расширение файла
        file_url: 'http://xxx.xxx.xxx/xxx/xxxxx', // Адрес предварительного просмотра  
    },
    ...
]