Question

我在sap.m.List中使用sap.m.TextArea控件，其中每个TextArea的值都映射到JSONModel。这是xml-view代码：

<List id="otherPicList" growing="true" items="{ path : 'newRequest>/OtherPic' }" >
    <items>     
        <CustomListItem type="Inactive">
        <Image id="otherPic" src="{newRequest>pic}" width="90px" height="60px" />   
        <VBox>                  
            <TextArea value="{newRequest>text}"/>                                       
        </VBox> 
        </CustomListItem>
    </items>
</List>

当我开始在sap.m.TextArea中输入内容时，它会在第一个字符后冻结。如果我在控件外面再次点击内部，我只能输入一个字符。我认为这个bug是因为sap.m.List控件中的数据绑定而发生的。

如果我在没有模型绑定的情况下设置value属性，它就可以正常工作。这是一个已知的错误还是我使用了错误的控件？

Answer 1

它适用于我的代码段。请运行并检查。也许还有其他因素导致你的问题。

<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m,sap.ui.commons"></script>
 
	
	<!-- define an XMLView - normally done in a separate file -->
	<script id="view1" type="sapui5/xmlview">
		<mvc:View xmlns:core="sap.ui.core" xmlns:layout="sap.ui.commons.layout" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
				controllerName="my.own.controller" xmlns:html="http://www.w3.org/1999/xhtml">
			<List id="otherPicList" items="{/test}" >
              <items>     
                  <CustomListItem type="Inactive">
                  <Image id="otherPic" src="{pic}" width="90px" height="60px" />  
                  <VBox>                  
                      <TextArea value="{text}"/>                                       
                  </VBox> 
                  </CustomListItem>
              </items>
            </List>
		</mvc:View> 
	</script>
	
	
	<script>
		sap.ui.controller("my.own.controller", {
           
			onInit:function() {
              var data = {test:[{text:"123",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"456",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"789",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"101112",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"}]};
              var oModel = new sap.ui.model.json.JSONModel();
              
              oModel.setData(data);
              this.getView().setModel(oModel);
            }
          
           
		});
		
		var myView = sap.ui.xmlview("myView", {viewContent:jQuery('#view1').html()}); // 
		myView.placeAt('content');
		
		
	</script>
	

	<body class='sapUiBody'>
		<div id='content'></div>
	</body>

Answer 2

我发现了问题，请查看您的代码段，包括sap.m.List控件中的属性grow =“true”。这个属性导致了我所说的奇怪行为。

<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m,sap.ui.commons"></script>
 
	
	<!-- define an XMLView - normally done in a separate file -->
	<script id="view1" type="sapui5/xmlview">
		<mvc:View xmlns:core="sap.ui.core" xmlns:layout="sap.ui.commons.layout" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
				controllerName="my.own.controller" xmlns:html="http://www.w3.org/1999/xhtml">
			<List id="otherPicList" growing="true" items="{/test}" >
              <items>     
                  <CustomListItem type="Inactive">
                  <Image id="otherPic" src="{pic}" width="90px" height="60px" />  
                  <VBox>                  
                      <TextArea value="{text}"/>                                       
                  </VBox> 
                  </CustomListItem>
              </items>
            </List>
		</mvc:View> 
	</script>
	
	
	<script>
		sap.ui.controller("my.own.controller", {
           
			onInit:function() {
              var data = {test:[{text:"123",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"456",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"789",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"},{text:"101112",pic:"https://www.gravatar.com/avatar/e25560c87abbbb90143653d98c9924dc?s=128&d=identicon&r=PG"}]};
              var oModel = new sap.ui.model.json.JSONModel();
              
              oModel.setData(data);
              this.getView().setModel(oModel);
            }
          
           
		});
		
		var myView = sap.ui.xmlview("myView", {viewContent:jQuery('#view1').html()}); // 
		myView.placeAt('content');
		
		
	</script>
	

	<body class='sapUiBody'>
		<div id='content'></div>
	</body>

Answer 3

数据绑定和增长列表不够智能：

在输入事件（键击之后）更改和更新文本区域的值后，使用以下差异更新数据绑定：
- 1项已删除
- 2项已更新
Growing List会监听数据模型更改并执行完全相同的操作：它会删除更改的项目并再次创建它。

当从DOM中删除列表项内的文本区域时，焦点将丢失。新的文本区域没有得到关注，任何后续的击键都无处可去。

我会将此问题报告给开发人员。

sap.m.List中的奇怪的sap.m.TextArea行为

3 个答案: