List sencha中列表的换行符

我正在创建一个列表，在该列表中添加元素。现在，如果我在列表中添加一个没有换行符的长句子，它就超出了范围

我想要的是，如果单词太长，我应该明确地打断它，以便它出现在下一行。我不知道该怎么做

{
            cls:'notesList',
            xtype:'list',
            id:'notesList',
            height:300,
            whitespace:pre-wrap,
            allowDeselect: false,
            style:'background-color: rgba(0,140,153,1.0);',
            itemTpl:'<table><tr><td width="3%"><img src="resources/images/user.png" width="20em" height="20em" /></td>' +
                '<td width = "60%" style="font-weight:bold;text-align:left;">{Author}</td>' +
                '<td width = "40%" style="font-weight:bold;text-align: right">{Name}</td></tr>'+
                '<tr><td colspan=3>{Text}</td></tr></table>'
        },

{
cls:“注释列表”，
xtype:“列表”，
id:'notesList'，
身高：300，
空白：预包装，
allowDeselect:false，
样式：“背景色：rgba（0140153,1.0）；”，
itemTpl:'+
“{作者}”+
“{Name}”+
“{Text}”
},

我曾经遇到过这个问题，我通过在文本容器中添加一些CSS来解决它

通过使用列表上的itemCls配置，将CSS类添加到列表的项目中

然后将以下内容添加到.CSS中的这个CSS类

word-wrap: break-word;
overflow: hidden;
max-width: 247px;
width: 247px;

---

希望这有助于

嘿@Knush将此说明添加到您的元素

空白：预包装

能否指定

宽度

到

输入文本

比如说,

进入

风格

....
items: [
{
    text: '<p class="your_class" face="Arial" size="2" style="text-align:center;white-space:pre-wrap;" >lkjsdlksdj ewiouwe iouiuio</p>',
    id: 'ce',
    handler: function() {
        stuff()
    },
},
 ]
...

---

我希望这有帮助。：）

我对Sencha一无所知（或者很少，只是刚刚开始），但也许你可以在css中指定一些最大宽度，然后文本会自动调整？如果你还没有找到答案，就创建一个Sencha提琴，我来看看。我在这里分享了我的代码。但是代码现在还没有运行，因为我是新手。这个工具看起来很有趣。请帮助我更好地理解这个工具。是经过编辑的链接。嘿，你能详细说明一下吗。我想我没有完全理解。请告诉我你做得怎么样。哦，我明白了，不，不，

空白：预包装

进入

风格

。我更新我的答案

.your_label {
   width: 60px;
   white-space:pre-wrap;
}