破折号仪表板中可更新图像的示例

Question

我采用了时髦的示例仪表板并添加了一些小部件 - 两个 Image 和一个 BigImage 小部件：

    <li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
      <div data-id="image2" data-view="Image" data-image="images/image2.jpg" title="Image2" data-link='abc' style="background-color:#ff9618"></div>
    </li>
    <li data-row="1" data-col="1" data-sizex="3" data-sizey="2">
  <!-- <div data-id="picture" data-view="BigImage" data-image="file:///shared/images/aura0.jpg" -->
  <div data-id="picture" data-view="BigImage" data-image="https://www.google.com/images/nav_logo195_hr.png"
    style="background-color:transparent;"
    data-max="true"
  ></div>
</li>

小部件的占位符会显示，但图像不会：

当我点击时出现以下情况：

很明显，我缺少一些管道 - 以及这里的一些基本概念。将不胜感激指向要点或类似内容的指针。

Answer 1

您必须使用在浏览器可以加载的地方提供的图像。最简单的方法是将您的图片放入 assets/images，然后 link 放入 assets/my-image.jpg，像这样：

<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
  <div data-id="logo" data-view="Image" data-image="assets/my-image.jpg"></div>
</li>

此外，当您单击其中一个时出现该错误的原因是您定义了 data-link='abc'，它正在创建 link 到 /abc。这不存在，所以 Dashing 给你一个 404。

破折号仪表板中可更新图像的示例

Example of an update-able image in dashing dashboard

ruby

dashing