Change column width of Table in Perspective

To allow for a column to have its size specified, there are several conditions which must be met.

  1. You must have an entry in the props.columns array.
  2. One of the props.columns entries MUST have the field specified as a case-sensitive match to a key of your data (using the example data of the Table you could supply “city”, “country” or “population”).
  3. Supply a value for props.columns[x].width, where “x” is the index of the column specified to be the column for your field/key. The value you specify here is understood to be in pixels, so a value of 150 would mean “150px”. Supplying “px” as part of the value will result in it being ignored.

This screenshot displays how I’ve created a column entry, set my column entry’s field to “city” (which matches a key from my supplied data), and I’ve specified a width of 50. You can see that my “city” column is considerably thinner than my other columns. Any column which does NOT have a width set will stretch to fill the available area.

If you want the column to always be EXACTLY some width, you should set the props.columns[x].strictWidth property to be true

3 Likes