在sencha中创建IFrame

时间:2018-03-09 13:36:24

标签: javascript iframe extjs

我正在尝试使用sencha / ext6 现代将标签添加到标签栏。

目前我的尝试是有一个标签栏,如:

<div class="table-responsive">
  <table class="table">
    <thead>
      <tr class="text-nowarp">
        <th>Lorem ipsum</th>
        <th>sit consectetu</th>
        <th>consectetur adipisicing</th>
        <th>adipisicing</th>
        <th>Lorem</th>
      </tr>
    </thead>
    <tbody class="text-nowarp" style="white-space:nowarp;"> 
      <tr>
        <td class="text-nowarp"><span class="text-nowarp" style="white-space:nowarp;">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Odit exercitationem non quibusdam explicabo repellendus iure natus expedita, illum, possimus veritatis aspernatur inventore ad itaque. Eveniet consequatur cum modi nostrum animi?</span></td>

        <td class="text-nowarp" style="white-space:nowarp;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam deserunt earum ullam ea dolores rerum veniam eius voluptatum eligendi odio quis maxime, numquam laborum quaerat quo optio illum atque dolore.</td>

        <td class="text-nowarp" style="white-space:nowarp;">Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse voluptates nobis vel veniam autem magni laborum placeat porro eum magnam fugit ipsum aliquam maxime beatae, omnis molestiae quasi nesciunt nemo?</td>

        <td class="text-nowarp" style="white-space:nowarp;">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolore a facere aliquid at id? Neque, rerum assumenda! Cumque officia voluptatum exercitationem impedit error, placeat labore. Aperiam, saepe. Impedit, eligendi nam?</td>

        <td class="text-nowarp" style="white-space:nowarp;">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Cupiditate nobis eveniet quo asperiores aperiam! Sit beatae necessitatibus quae, explicabo quaerat blanditiis minima nulla iure voluptates dicta consectetur adipisci recusandae vel?</td>
      </tr>
    </tbody>
  </table>
</div>

框架为:

Ext.define('Heren5Frontend.view.main.Main', {
    extend: 'Ext.tab.Panel',
    xtype: 'app-main',

    controller: 'main',
    viewModel: 'main',

    defaults: {
        tab: {
            iconAlign: 'top'
        }
    },

    tabBarPosition: 'top',

    items: [{
            title: 'Aanmelden wedstrijd',
            //iconCls: 'x-fa fa-users',
            items:[{
                xtype: "attendenceframe",
                id: "frameId",
                src: "http://google.com",
            }]
        }
    ]
});

然而这失败了,因为找不到命名空间。更新Ext.define('Heren5.view.main.AttendenceFrame', { extend: 'Ext.ux.IFrame', xtype: 'attendenceframe', requires: [ 'Ext.ux.IFrame', ], }); 应该会有效吗?

app.json

但是,在构建时出现错误消息仍然失败:

"requires": [
    "font-awesome",
    "ext-ux"
],

1 个答案:

答案 0 :(得分:2)

Ext.ux.IFrame不是现代工具包的一部分。如果您查看文档,则会在搜索中看到Ext.ux.IFrame标有[C](经典),而不是[M](现代)。似乎没有类似的组件可用于现代工具包。

您可以尝试将code复制到项目中是否可以解决问题。