我正在创建一个更改日志,我决定从.html文件加载我的更改日志
我有
Ext.define('MeridianCRM.dialogs.recent?hanges.recent?hanges', {
extend : 'Ext.window.Window',
title : '????????? ????????? ?? ?????',
modal : true,
height : 400,
width : 500,
resizable : false,
html: 'changes.html',
buttons: [{
text: '???????',
handler: function() {
this.up('window').close();
}
}]
});
Run Code Online (Sandbox Code Playgroud)
我怎么能解决这个问题?(html:'changes.html')如何将html加载到我的窗口?
有一个更好的解决方案,使用面板loader配置的声明:
loader: {
url: 'changes.html',
autoLoad: true
},
Run Code Online (Sandbox Code Playgroud)
这将导致这个全局代码.
Ext.define('MeridianCRM.dialogs.recent?hanges.recent?hanges', {
extend : 'Ext.window.Window',
title : '????????? ????????? ?? ?????',
modal : true,
height : 400,
width : 500,
resizable : false,
loader: {
url: 'changes.html',
autoLoad: true
},
buttons: [{
text: '???????',
handler: function() {
this.up('window').close();
}
}]
});
Run Code Online (Sandbox Code Playgroud)
这是首选,因为我们不需要定义一个listener,也不需要Ext.Ajax调用.
您需要异步加载 html,然后将其注入到您的组件中。所以:
\n\nExt.Ajax.request({\n url: 'changes.html',\n success: function(response){\n // response.responseText will have your html content\n // you can then feed it into your component using update()\n }\n});\nRun Code Online (Sandbox Code Playgroud)\n\n因此,如果您使用 id 声明组件:
\n\nExt.define('MeridianCRM.dialogs.recent\xd0\xa1hanges.recent\xd0\xa1hanges', {\n extend : 'Ext.window.Window',\n title : '\xd0\x9f\xd0\xbe\xd1\x81\xd0\xbb\xd0\xb5\xd0\xb4\xd0\xbd\xd0\xb8\xd0\xb5 \xd0\xb8\xd0\xb7\xd0\xbc\xd0\xb5\xd0\xbd\xd0\xb5\xd0\xbd\xd0\xb8\xd1\x8f \xd0\xbd\xd0\xb0 \xd1\x81\xd0\xb0\xd0\xb9\xd1\x82\xd0\xb5',\n\n id: : 'my-log',\n\n ...\n});\nRun Code Online (Sandbox Code Playgroud)\n\n然后你可以这样做:
\n\nExt.Ajax.request({\n url: 'changes.html',\n success: function(response){\n Ext.getCmp('my-log').update( response.responseText );\n }\n});\nRun Code Online (Sandbox Code Playgroud)\n\n您可以将其“集成”到您的面板中,如下所示:
\n\nExt.define('MeridianCRM.dialogs.recent\xd0\xa1hanges.recent\xd0\xa1hanges', {\n extend : 'Ext.window.Window',\n title : '\xd0\x9f\xd0\xbe\xd1\x81\xd0\xbb\xd0\xb5\xd0\xb4\xd0\xbd\xd0\xb8\xd0\xb5 \xd0\xb8\xd0\xb7\xd0\xbc\xd0\xb5\xd0\xbd\xd0\xb5\xd0\xbd\xd0\xb8\xd1\x8f \xd0\xbd\xd0\xb0 \xd1\x81\xd0\xb0\xd0\xb9\xd1\x82\xd0\xb5',\n\n id: : 'my-log',\n\n listeners: {\n 'render': function()\n {\n Ext.Ajax.request({\n url: 'changes.html',\n success: function(response){\n Ext.getCmp('my-log').update( response.responseText );\n }\n }); \n }\n }\n\n ...\n});\nRun Code Online (Sandbox Code Playgroud)\n\n但请注意,如果返回的 html 包含,您可能会遇到问题<head>标记(因为 extjs 页面已经有一个标记),您可能会遇到问题。