1

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

第三个元素，这是添加到列表后的样子

那是应该添加到列表中的实际文本

我想要的是，如果这个词太长，我会明确地打破它，以便它出现在下一行。我不确定该怎么做。

{
            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>'
        },
4

2 回答 2

0

嘿@Knush 将此说明添加到您的元素中，white-space:pre-wrap您可以具体width到input text.

例如，

进入style

....
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()
    },
},
 ]
...

或者来自 CSS 类

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

我希望这有帮助。:)

于 2012-06-28T09:48:47.880 回答
0

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

使用列表中的 itemCls 配置将 CSS 类添加到列表项。

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

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

希望这可以帮助

于 2012-06-26T17:10:36.983 回答