Question

我希望在stackoverflow上分享SAPUI5的实时示例，但我不知道如何创建JSBin示例或我们必须添加哪些内容，或者是否有任何简单的方法来创建JSBin的演示示例。

Answer 1

或者，您可以点击蓝色＆＃39;运行代码段＆＃39;来创建可运行的Stack Snippet。按钮：

＆＃13;

sap.ui.controller("view1.initial", {
onInit : function(oEvent) {
    var oModel = new sap.ui.model.json.JSONModel();
    oModel.setData({
        rows : [
            { value : "sap-icon://syringe",    col2 : "Value 2",  col3 : "Value 3",  ol4 : "Value 4" },
            { value : "sap-icon://account",    col2 : "Value 10", col3 : "Value 11", col4 : "Value 12" },
            { value : "sap-icon://chalkboard", col2 : "Value 14", col3 : "Value 15", col4 : "Value 16" },
            { value : "sap-icon://e-care",     col2 : "Value 18", col3 : "Value 19", col4 : "Value 20" }
        ]
    });

    this.getView().setModel(oModel);
}
});

sap.ui.xmlview("main", {
viewContent: jQuery("#view1").html()
})
.placeAt("uiArea");

＆＃13;

/* extra CSS classes here */

＆＃13;

<script id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-libs="sap.m"></script>

<div id="uiArea"></div>

<script id="view1" type="ui5/xmlview">
<mvc:View controllerName="view1.initial" xmlns="sap.m" xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc">
    <Table items="{/rows}">
        <columns>
            <Column>
                <Text text="Col1" />
            </Column>
            <Column>
                <Text text="Col2" />
            </Column>
            <Column>
                <Text text="Col3" />
            </Column>
        </columns>
        <items>
            <ColumnListItem>
                <cells>
                    <core:Icon src="{value}" />
                    <Text text="{col2}" />
                    <Text text="{col3}" />
                </cells>
            </ColumnListItem>
        </items>
    </Table>
</mvc:View>
</script>

＆＃13;

Answer 2

您将需要引导脚本View，该脚本仅位于 HTML 标签中，并且位于 Javascript 标签下的Controller。

您可以在登录后将this保存为模板，并将其用作示例的起点。

JSBin：如何创建sapui5的演示示例？

2 个答案: