基本openUI5拆分视图应用程序
基本openUI5拆分视图应用程序
提问于 2015-02-17 12:46:06
我想用openUI5 / SAPUI5设置两个窗格拆分器视图
我的代码如下：
index.html
<!DOCTYPE html>
<html><head>
meta http-equiv='X-UA-Compatible' content='IE=edge' />
<title>Hello World</title>
<script id='sap-ui-bootstrap'
src='resources/sap-ui-core.js'
data-sap-ui-theme='sap_bluecrystal'
data-sap-ui-libs='sap.m'>
</script>
<script>
//Set an object
var myView = sap.ui.xmlview("Splitter");
// put the View onto the screen
myView.placeAt('content');
</script>
</head>
<body class='sapUiBody'>
<div id='content'></div>
</body>
</html>Splitter.controller.js：
sap.ui.controller("Splitter", {
onInit: function () {
}
});Splitter.view.xml：
<mvc:View
controllerName="Splitter"
xmlns:l="sap.ui.layout"
xmlns:core="sap.ui.core"
xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.ui.commons">
<l:Splitter height="500px">
<Button height="100%" width="100%" text="Content 1">
<layoutData><l:SplitterLayoutData size="30%" resizable="false"/></layoutData>
</Button>
<Button height="100%" width="100%" text="Content 2">
<layoutData><l:SplitterLayoutData size="auto" /></layoutData>
</Button>
</l:Splitter>
</mvc:View>但是，页面上没有显示任何内容，在我的Chrome工具中，我有以下错误：
“未定义的TypeError:未定义不是index.html第13行的函数”，这是在我的视图上设置的。
库已正确设置并正在链接。
回答 2
Stack Overflow用户
回答已采纳
发布于 2015-02-18 14:36:11
我猜它在加载视图时失败了，因此调用了未定义的placeAt。您应该让UI5-Framework知道您的本地资源。否则，它将尝试从“ressource”文件夹中获取所有重新源(如视图、实用程序)，这在您的情况下是不正确的。经常使用的项目结构如下所示：
WebContent
| index.html
| view
| Splitter.controller.js
| Splitter.view.js当然，您可以将文件夹命名不同。如果我将这个模式和下面的代码调整到您的项目中，那么它对我是有效的。
index.html
<script src="resources/sap-ui-core.js" id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m,sap.ui.layout,sap.ui.commons"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- load "sap.m", "sap.ui.layout" and "sap.ui.commons" as you´re using them in your view -->
<script>
// make the framework aware of your ressource folder:
sap.ui.localResources("view");
// instantiate your view by its full qualified name:
var myView = sap.ui.xmlview("view.Splitter");
// put the View onto the screen
myView.placeAt('content');
</script>控制器(位于view/Splitter.Controer.js中)
sap.ui.controller("view.Splitter", {
onInit: function() {
}
});视图(位于View /Splitter.view.xml中)
<mvc:View
controllerName="view.Splitter"
xmlns:l="sap.ui.layout"
xmlns:core="sap.ui.core"
xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.ui.commons">
<l:Splitter height="500px">
<Button height="100%" width="100%" text="Content 1">
<layoutData><l:SplitterLayoutData size="30%" resizable="false"/></layoutData>
</Button>
<Button height="100%" width="100%" text="Content 2">
<layoutData><l:SplitterLayoutData size="auto" /></layoutData>
</Button>
</l:Splitter>
</mvc:View>Stack Overflow用户
发布于 2015-02-18 15:57:42
我认为你应该使用sap.ui.core.mvc.xmlview("Splitter")而不是sap.ui.xmlview("Splitter")；
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28561854
复制相关文章
相似问题
腾讯云开发者
