如何解决ExtJS 7.3.1 现代 - 在文本字段中显示静态文本
我正在尝试在 textfield
内显示静态文本,例如 %
标志。有没有办法做到这一点?如果我使用 tpl
或 html
属性,文本将显示在新行上。经典中似乎有一个属性 afterSubTpl
,现代工具包中是否有类似的东西?
感谢您的帮助!
编辑
我试图实现这样的目标:
%
应该在输入的文本后面静态可见,并在输入的文本长度增加时移动。
解决方法
我找到了在输入值后显示一些文本的解决方案。这将适用于从 Ext.field.Text
扩展的所有字段。
Ext.define('MyApp.overrides.field.Text',{
override: 'Ext.field.Text',config: {
suffix: null
},setSuffix: function (suffix) {
this.callParent(arguments);
this.setBind({
data: {
value: `{${this.getBind().value.stub.path}}`
}
});
let field = this.inputElement,tpl = new Ext.XTemplate(
`<div style="left: {value:this.getWidth}px; top: 0; position:absolute; pointer-events: none">${suffix}</div>`,{
getWidth: function (value) {
return field.getTextWidth(value) + 3;
}
});
this.setTpl(tpl);
}
});
要使用它,您可以执行以下操作:
xtype: 'textfield',bind: {
value: '{myProperty}'
},suffix: '%'
也可以动态绑定:
xtype: 'textfield',bind: {
value: '{myProperty}',suffix: '{mySuffix}'
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。