javascript - Cx框架: How to set align:right and decimal precision on NumberField

Question

我正在开发一个项目，其中 IU 在 Cx 中完成，Cx 是基于新的 React 的前端框架。 https://cxjs.io/
我有一个网格，每列顶部都有过滤字段。
例如，这是数字列和字段:

{
    field: 'score', sortable: true,
    header: {
        style: 'width: 150px',
        items: <cx>
            <div>
                Score
                <br />
                <NumberField style="width:100%;margin-top:5px" value:bind="$page.filter.score"
                    reactOn="enter blur"/>
            </div>
        </cx>
    },
},

但是值在左侧，而我需要它在右侧。 我希望网格和过滤字段值都位于右侧，但将列名称保留在左侧。就像 Excel 中通常的情况一样。 另外如何设置自定义小数位数，例如 2？

Answer 1

NumberField 小部件允许通过 inputStyle 在输入元素上设置其他样式。格式化是使用 format 完成的。网格列标题可以仅使用 style 设置自己的样式。

考虑到所有这些，它应该是这样的:

{
    field: "score",
    sortable: true,
    header: {
      style: "width: 150px; text-align: left",
      items: (
        <cx>
          <div>
            Score
            <br />
            <NumberField
              value:bind="$page.filter.score"
              format="n;2"
              style="width:100%;margin-top:5px"
              inputStyle="text-align: right"
              reactOn="enter blur"
            />
          </div>
        </cx>
      )
    }
  }