无法将图像保存到插件中

我没有太多关于撇号的知识,但我试图创build一个自定义小部件。 我想在我的小部件中有三个字段:

  1. 标题(string)
  2. 描述(string)
  3. 一个图像

我还没有find一种方法来添加一个图像的小部件作为领域。

现在,我在窗口小部件中添加了一个单例,它工作正常。 但是当添加一个图像时,它会显示在页面上,但是当我重新加载页面时,图像不见了。

我的widget.html代码

 <div class="md-jumbotron"> <div class="md-grid"> <h1>{{ data.widget.heading }}</h1> <h6>{{ data.widget.desc }}</h6> <div class="img"> {{ apos.singleton(data.page, 'jumbotroPic', 'apostrophe-images', { limit: 1, size: 'full' }) }} </div> </div> 

我在控制台上得到了以下内容

 $ node app.js WARNING: No session secret provided, please set the `secret` property of the `session` property of the apostrophe-express module in app.js WARNING: widget type text exists in content but is not configured WARNING: widget type text exists in content but is not configured I see no data/address file, defaulting to address 0.0.0.0 I see no data/port file, defaulting to port 3000 Listening on 0.0.0.0:3000 WARNING: widget type text exists in content but is not configured WARNING: widget type text exists in content but is not configured WARNING: widget type text exists in content but is not configured WARNING: widget type text exists in content but is not configured 

我的小部件的JavaScript代码是:

 module.exports = { extend: 'apostrophe-widgets', label: 'Jumbotron', addFields: [ { name: 'heading', type: 'string', label: 'Heading', required: true }, { name: 'desc', type: 'string', label: 'Description', required: true } ], construct: function(self, options) { var superPushAssets = self.pushAssets; self.pushAssets = function() { superPushAssets(); self.pushAsset('stylesheet', 'jumbotron', { when: 'always' }); }; } }; 

您可以像这样将一个图像小部件添加到您的小部件的模式

  { name: 'image', label: 'Jumbo Image', type: 'singleton', widgetType: 'apostrophe-images', options: { limit: 1, } } 

只需将其粘贴到addFields数组中。

感谢您试用撇号!

好的,我发现了整个解决scheme:

这里是我的小部件模式:

  module.exports = { extend: 'apostrophe-widgets', label: 'Jumbotron', addFields: [ { name: 'heading', type: 'string', label: 'Heading', required: true }, { name: 'desc', type: 'string', label: 'Description', required: true }, { name: 'image', label: 'Jumbo Image', type: 'singleton', widgetType: 'apostrophe-images', options: { limit: 1, } } ], construct: function(self, options) { var superPushAssets = self.pushAssets; self.pushAssets = function() { superPushAssets(); self.pushAsset('stylesheet', 'jumbotron', { when: 'always' }); }; } }; 

这里是我的小部件的HTML代码

 <div class="md-jumbotron"> <div class="md-grid"> <h1> {{ data.widget.heading }} </h1> <h6> {{ data.widget.desc }} </h6> <div class="img"> {{ apos.singleton( data.widget, 'image', 'apostrophe-images', { edit: false } ) }} </div> </div> </div> 

从这里采取HTML代码