Ich habe kürzlich die FileUploader Ui-Komponente in meinem Formular auf Magento 2.1.7 implementiert.
Der Code dafür ist hier ( app / code / Vendor / Blog / view / adminhtml / ui_component / vendor_blog_form.xml ):
<field name="featured_images">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">text</item>
<item name="label" translate="true" xsi:type="string">Hervorgehobene Bilder:</item>
<item name="formElement" xsi:type="string">fileUploader</item>
<item name="componentType" xsi:type="string">fileUploader</item>
<item name="previewTmpl" xsi:type="string">Magento_Catalog/image-preview</item>
<item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
<item name="allowedExtensions" xsi:type="string">jpg jpeg gif png</item>
<item name="notice" xsi:type="string" translate="true">Erlaubte Dateitypen: png, gif, jpg, jpeg.</item>
<item name="maxFileSize" xsi:type="number">2097152</item>
<item name="source" xsi:type="string">blog</item>
<item name="sortOrder" xsi:type="number">10</item>
<item name="dataScope" xsi:type="string">featured_images</item>
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">false</item>
</item>
<item name="uploaderConfig" xsi:type="array">
<item name="url" xsi:type="url" path="vendor_blog/blog/upload"/>
</item>
</item>
</argument>
</field>
Mein Controller dafür ist folgendes ( App / Code / Vendor / Blog / Controller / Adminhtml / Blog / Upload.php ):
<?php
namespace Vendor\Blog\Controller\Adminhtml\Blog;
use Magento\Framework\App\Filesystem\DirectoryList;
use Magento\Backend\App\Action;
class Upload extends \Vendor\Blog\Controller\Adminhtml\Blog
{
protected $_fileUploaderFactory;
protected $_directory_list;
protected $_logger;
public function __construct(
Action\Context $context,
\Magento\Framework\Registry $coreRegistry,
\Magento\MediaStorage\Model\File\UploaderFactory $fileUploaderFactory,
\Magento\Framework\App\Filesystem\DirectoryList $directory_list,
\Psr\Log\LoggerInterface $logger
) {
$this->_fileUploaderFactory = $fileUploaderFactory;
$this->_directory_list = $directory_list;
$this->_logger = $logger;
parent::__construct($context, $coreRegistry);
}
public function execute(){
$uploader = $this->_fileUploaderFactory->create(['fileId' => 'featured_images']);
$uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png']);
$uploader->setAllowRenameFiles(false);
$uploader->setFilesDispersion(false);
$path = $this->_filesystem->getDirectoryRead(DirectoryList::MEDIA)->getAbsolutePath('blog');
//$path = $this->_directory_list->getPath('media') . '/blog';
$this->_logger->debug('Uploader.php: '.$path);
$uploader->save($path);
}
}
Wenn ich jedoch ein Bild hochlade und den Aufruf in der Chrome-Konsole überprüfe, wird ein Fehler 500 mit der Ausnahme angezeigt : Das Array $ _FILES ist leer .
Ich kämpfe seit zwei Tagen, aber ich kann es nicht bekommen, um richtig zu arbeiten. Wenn ich die $path
Zeile mit der alternativen Variablen auskommentiere, ist der Upload erfolgreich, aber ich erhalte keine Vorschau.
Ich habe gelesen, dass dies möglicherweise enctype
das Formular ist, das das Problem verursacht, aber ich habe keine Informationen dazu gefunden, wie dies für ein UI Component-Formular überprüft werden kann.
Wenn Sie den gesamten Ausnahmecode benötigen, lassen Sie es mich bitte wissen.
Ich schätze jede mögliche Hilfe. Vielen Dank!
quelle
Antworten:
Ich folge diesen Schritten, um die UI FileUploader-Komponente in Admin-Form hinzuzufügen
Ich verwende die UI FileUploader-Komponente, um ein Symbol für meine FAQ-Erweiterung hochzuladen. Sie können von hier aus auf Folgendes verweisen: https://github.com/mageprince/magento2-FAQ
1) Feld
admin_form.xml
hinzufügen in (Admin-Formular)2) Nun müssen wir einen Controller erstellen, den wir
uploaderConfig
in Admin-Form definieren:<item name="url" xsi:type="url" path="vendor_module/faqgroup/upload"/>
3) Erstellen
ImageUploader.php
4) Erstellen
image-preview.html
5)
ImageUploader.php
Fügen Sie nun Argumente für in di.xml hinzuÜberprüfen Sie diese Datei, um das hochgeladene Bild im Bearbeitungsformular zu laden: DataProvider.php
AUSGABE:
Bild in Datenbank speichern
So zeigen Sie das hochgeladene Bild in der Formularbearbeitungsseite an:
quelle
Ergänzung für Magento 2.2 UI-Komponente
Vergleichen Sie mit Magento 2.1, in Magento 2.2 hatte die UI-Komponente einige optionale Unterschiede wie unten. Wir könnten den Beamten
Magento_Catalog/image-preview
als Vorschau-Vorlage verwenden, und der Rest der Codes wie Controller könnte sich auf die akzeptierte Antwort beziehen .quelle
TypeError: value.map is not a function
. Wie kann ich das beheben